@form-create/vant
Version:
Vant 版本(移动端)低代码表单 | FormCreate 是一个可以通过 JSON 生成具有动态渲染、数据收集、验证和提交功能的低代码表单生成组件。
39 lines (35 loc) • 1.13 kB
JSX
import {defineComponent, toRef} from 'vue';
const NAME = 'fcRadio';
export default defineComponent({
name: NAME,
inheritAttrs: false,
props: {
modelValue: [String, Number, Boolean],
options: Array,
},
emits: ['update:modelValue', 'change'],
setup(props, _) {
const modelValue = toRef(props, 'modelValue', []);
const options = toRef(props, 'options');
return {
options,
modelValue,
onInput(val) {
_.emit('update:modelValue', val);
_.emit('change', val);
},
}
},
render() {
return <van-radio-group direction="horizontal" {...this.$attrs} modelValue={this.modelValue}
onUpdate:modelValue={this.onInput}>
{(this.options || []).map(opt => {
const tmp = {...opt};
const {text, value} = opt;
delete tmp.text;
delete tmp.value;
return <van-radio name={value} {...tmp}>{text || opt.label || value}</van-radio>
})}
</van-radio-group>
}
});