问答博客标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
php
java
vue.js
git
html5
python
node.js
android
mysql
react.js
linux
ios
css
golang
spring
docker
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

vue 绑定radio已选中状态怎么没显示出来？

头像
吃半个馒头
    1.4k16182217

    http://jsbin.com/wemipabeze/1...（已更新）

    如果收到radio选中的数据

    为何vue绑定的input radio 已选中的数据无法正常显示？

    抱歉更新一下编辑

    有一个大大问题
    每组中的radio
    如果选择非已选中的数据，其它不会去取消掉。全部选中都是选中状态。
    这是什么情况呢？
    如何让单选题必须只选中一个，随便选中其它不会撤掉这是个bug.

    vue.js
    阅读 10.2k
    2 个回答
    得票最新
    头像
    hfhan
      28.9k72241
      <!DOCTYPE html>
<html lang="cmn-hans">

<head>
    <meta charset="utf-8">
    <meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <script src="https://cdn.bootcss.com/vue/2.5.13/vue.js"></script>
    <title>Vue</title>
</head>

<body>
    <hr>
    <div id="app">
        <input type="radio" id="one" value="One" v-model="picked">
        <label for="one">One</label>
        <br>
        <input type="radio" id="two" value="Two" v-model="picked">
        <label for="two">Two</label>
        <br>
        <span>选中情况: {{ picked }}</span>
    </div>
    <script>
    var app = new Vue({
        el: "#app",
        data: {
            picked: "one"
        },
    });
    </script>
</body>

</html>
      头像
      luozz
        5.8k3629

        在data定义picked的时候出错了，不应该定义为true，应该分情况：
        1、若默认不选中任何值，则将picked定义为""(空)
        2、若默认显示某一个，则将picked的值设置成对应的value值，例如默认选中value为One的radio,则picked为"One"

        希望我的回答对你有所帮助！

        撰写回答
        你尚未登录，登录后可以
        • 和开发者交流问题的细节
        • 关注并接收问题和回答的更新提醒
        • 参与内容的编辑和改进，让解决方法与时俱进
        推荐问题
        宣传栏