vue select 绑定 value
时间: 2024-02-11 15:06:07 浏览: 31
在Vue中使用`<select>`标签进行选项选择时,可以使用`v-model`指令来绑定选项的值。`v-model`会根据选中的选项自动更新绑定的数据,而绑定的数据也会影响选中的选项。例如:
```html
<select v-model="selected">
<option value="option1">选项1</option>
<option value="option2">选项2</option>
<option value="option3">选项3</option>
</select>
```
在上述代码中,`v-model`指令绑定了一个名为`selected`的数据。当用户选择了一个选项时,`selected`的值会自动更新为选中选项的`value`值。
如果需要设置默认选中项,可以在绑定数据中设置初始值。例如:
```html
<select v-model="selected">
<option value="option1">选项1</option>
<option value="option2">选项2</option>
<option value="option3">选项3</option>
</select>
```
```javascript
export default {
data() {
return {
selected: 'option2'
}
}
}
```
在上述代码中,`selected`的初始值为`option2`,因此当组件渲染时,`选项2`会被默认选中。