uniapp的radio双向绑定

UniApp 是一套基于 Vue.js 的框架，用于快速构建跨平台应用，包括 Web、H5、App（iOS/Android）等。Radio（单选框）在 UniApp 中的双向数据绑定是通过 Vue 的内置特性实现的，即当你在界面中改变 Radio 的值时，对应的 Vue 实例中的数据会自动更新；反之，当你修改数据模型，UI 控件也会实时响应。

使用 UniApp 中 Radio 的双向绑定，你可以按照以下步骤操作：

1. 在模板中声明 Radio 组件，并绑定一个数据属性作为选项值：

<template>
  <view>
    <radio-group v-model="selectedOption">
      <radio :value="option.value" label="Option {{ option.label }}" :key="option.key" @change="onChange" :disabled="option.disabled" v-for="(option, index) in options" />
    </radio-group>
  </view>
</template>

2. 在 script 部分定义数据模型 `selectedOption` 和 `options` 数组：

<script>
export default {
  data() {
    return {
      selectedOption: '',
      options: [
        { value: 'option1', label: 'Option 1', disabled: false },
        { value: 'option2', label: 'Option 2', disabled: false },
        // ... 更多选项
      ],
    };
  },
  methods: {
    onChange(value) {
      console.log('Selected option changed:', value);
    },
  },
};
</script>

3. 当 `selectedOption` 的值变化时，`onChange` 方法会被调用，展示了数据和视图的同步。