Question

我有2个单选按钮。我需要在vue.js中使用v-model将它们的值绑定到变量。添加v-model时，两个单选按钮显示为未选中。

<div class="radio-item">
  <input type="radio" id="ritema" name="ritem" value="business" checked v-model="picked">
  <label for="ritema">Business </label>
</div>

<div class="radio-item">
    <input type="radio" id="ritemb" name="ritem" value="public" v-model="picked">
    <label for="ritemb">Public</label>
</div>

Answer 1

v-model总是使用data属性作为唯一的事实来源。

v-model将忽略在任何表单元素上找到的初始值，已检查或选定的属性。它总是将Vue实例数据视为真实的来源。您应该在组件的数据选项内的JavaScript端声明初始值。

来源：https://vuejs.org/v2/guide/forms.html#Basic-Usage

正如评论所说，你只需要处理你的Vue实例中的pick值。

data() {
    return {
        picked: "business"
    };
}

默认情况下没有检查vue.js单选按钮？

1 个答案: