用v-model绑定响应式变量可实现单选按钮双向同步：选中即更新变量，变量变则自动切换选中项；vue2用data()返回对象，vue3用ref()或reactive()；同组radio共用v-model但value需不同；建议保留name属性以保障表单提交与可访问性；v-for渲染时须用:key确保状态正确。
用 v-model 绑定一个响应式变量，就能让单选按钮自动同步选中状态和数值——选哪个，变量就变成对应 value；变量变了，对应选项也自动被选中。
确保变量是响应式的
在 Vue 2 中，通过 data() 返回对象：
data() { return { selectedStatus: 'active' } }
在 Vue 3 组合式 API 中，用 ref() 或 reactive()：
const selectedStatus = ref('active')- 或
const state = reactive({ selectedStatus: 'active' })
每个 radio 都绑定同一个变量
所有同组单选框共用一个 v-model，但必须设不同的 value：
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章