el-radio被选中
时间: 2024-10-16 16:08:52 浏览: 29
在Element UI库中的`el-radio`组件,代表了一个单选按钮。当你想要设置一个`el-radio`被选中时,可以使用它的`value`属性来绑定数据,并通过`v-model`指令将其与Vue实例的数据关联起来。当用户的输入改变(例如点击按钮),`v-model`会自动更新对应的值,使得相应的`el-radio`显示为选中状态。
下面是一个简单的例子:
```html
<template>
<el-form-item label="性别">
<el-radio v-model="sex" :label="item.label" @change="handleChange" v-for="(item, index) in sexOptions" :key="index"></el-radio>
</el-form-item>
</template>
<script>
export default {
data() {
return {
sex: '',
sexOptions: [
{ label: '男', value: 'male' },
{ label: '女', value: 'female' },
]
};
},
methods: {
handleChange(val) {
console.log(`选择了 ${val} 选项`);
}
}
};
</script>
```
在这个例子中,`v-model="sex"`会将`sex`的数据绑定到第一个单选按钮上。当用户选择“男”或“女”,`handleChange`方法会被触发,打印出所选的选项。
阅读全文