el-radio-group中的@change事件怎么用
时间: 2024-09-30 07:02:37 浏览: 103
`el-radio-group` 是 Element UI 提供的一个用于创建单选按钮组的组件,在 Vue.js 中使用时,`@change` 是一个自定义事件,它会在用户选择新的 radio 选项时触发。这个事件通常绑定到一个函数上,以便你在用户切换选项时执行相应的业务逻辑。
例如:
```html
<template>
<el-radio-group v-model="selectedValue" @change="handleChange">
<el-radio label="Option 1">Option 1</el-radio>
<el-radio label="Option 2">Option 2</el-radio>
<el-radio label="Option 3">Option 3</el-radio>
</el-radio-group>
</template>
<script>
export default {
data() {
return {
selectedValue: 'Option 1', // 初始选择的值
};
},
methods: {
handleChange(value) {
console.log('当前选择的值:', value);
// 在这里可以做更多的操作,比如更新状态、发送请求等
}
}
};
</script>
```
在这个例子中,当用户点击不同的 radio 选项时,`handleChange` 方法会被调用,并将新的选择值作为参数传入。
阅读全文