v-model 指令在表单  及 ) 并不会生效，应用 v-model 来代替。

五、选择框

1、单选

单选

   
      请选择
      
      
      
   
   Selected: {{ selecte }}

image.png

2、多选



   
   
   



Selected: {{ selected }}

Vue.js框架 v-model指令_第11张图片Vue.js框架 v-model指令_第12张图片

用 v-for 渲染的动态选项

<select v-model="selected">
  <option v-for="option in options" v-bind:value="option.value">
    {{ option.text }}
  option>
select>
<span>Selected: {{ selected }}span>
 
new Vue({
  el: '...',
  data: {
    selected: 'A',
    options: [
      { text: 'One', value: 'A' },
      { text: 'Two', value: 'B' },
      { text: 'Three', value: 'C' }
    ]
  }
})

image.png