今天碰见一个需求, element的 el-radio-group 如果设置了默认值,那么默认选中的单选、是不能再次点击并且触发他的默认事件的。需求是既要默认还要能够点击触发。那么大多数人的想法是使用 @click.native,然后就出现了问题(没有禁止原生带的事件所产生的,绑定的值错误问题),下面给出解决方案(使用@click.native.prevent 相当于重写事件了)
<el-radio-group v-model="ybType" >
<el-radio-button label="1" @click.native.prevent="radioChange('1')">红苹果</el-radio-button>
<el-radio-button label="2" @click.native.prevent="radioChange('2')">青苹果</el-radio-button>
</el-radio-group>
给绑定的值、手动赋值
methods: {
radioChange(ybType) {
this.ybType = ybType
//...业务逻辑
},
}