element ui radioGroup的使用备注
正常使用时,像form中或table中,change方法可以正常返回选中的label值,如:
<template>
<el-radio-group v-model="radio" @change="a">
<el-radio :label="3">备选项1</el-radio>
<el-radio :label="6">备选项2</el-radio>
<el-radio :label="9">备选项3</el-radio>
</el-radio-group>
</template>
<script>
export default{
data () {
return {
radio: 3
};
},
methods: {
a(val) {
console.log('val',val) // 点击备选项3时返回9
}
}
}
但如果放在render中使用,change方法返回的是当前值,不是本次新选中的要改变的值,这时需要增加input方法,用于赋值。如:
render() {
const radio = 3;
return h(
'el-radio-group',
{
props: {
value: radio
},
on: {
// change: function (curVal) {
// console.log('curVal', curVal); // curVal返回的不是选中值,是原值,即点击备选项3时返回的仍是3
// radio = curVal;
// },
input: function (curVal) {
console.log('curVal', curVal); // curVal返回的选中值,即点击备选项3时返回9
radio = curVal;
}
}
},
options.map((item) => {
return h(
'el-radio',
{
props: {
label: item.value
}
},
item.label
);
})
);
}