vue3父子组件之间的双向数据绑定

前面文章中的代码中的关于父子组件之间的双向数据绑定，在这里说明一下：

<el-radio-group v-model="selectValue">
    <el-radio-button v-for="item in selectOptions" :key="item.id" :label="item.label" 
  </el-radio-group>

自定义组件中selectValue值是计算父组件传值payMethod而来：

const props = defineProps({
  payMethod: [String, Number]
});
const emits = defineEmits(['update:payMethod']);
const selectValue = computed({
    get: () => { return props.payMethod },
    set: newVal => emits('update:payMethod', newVal)
});

这里的update:payMethod表示这个组件可以触发一个事件来更新与 v-model 绑定的值。

所以在父组件中使用：

<PayMethodSelect v-model:payMethod="payMethod" />