vue 中 radio 的 v-model 实现原理是什么？

2018-09-23 01:39:07 +08:00
 kommit

https://cn.vuejs.org/v2/guide/forms.html#%E5%8D%95%E9%80%89%E6%8C%89%E9%92%AE

vue 文档的这个示例中有两个 radio，使用开发者工具查看它们的 DOM 元素，发现没有 name 属性。

按照 HTML 标准，把多个 radio 识别为同一个 group 的条件之一是具有相同的 name 属性。

那么 vue 是怎么做到让这两个 radio 互斥的呢？

2174 次点击
所在节点    问与答
2 条回复
XiaoxiaoPu
2018-09-23 02:12:58 +08:00
checked 跟 model 绑定，这样一个 radio 的 checked 为 true 时，别的 radio 自然 checked 为 false 了

https://github.com/vuejs/vue/blob/dev/src/platforms/web/compiler/directives/model.js#L96
chooin
2018-09-23 19:24:35 +08:00
https://github.com/Hema-FE/c-mobile/tree/master/packages/components/radio

给你一个栗子

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/491858

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX