Question

<div class="btn-group clearfix" data-toggle="buttons" v-radio="auth">
    <label class="btn btn-sm btn-default active">
        <input type="radio" name="auth" value="1">
        Apple
    </label>
    <label class="btn btn-sm btn-default">
        <input type="radio" name="auth" value="2">
        Banana
    </label>
    <label class="btn btn-sm btn-default" v-if="isRich">
        <input type="radio" name="auth" value="3">
        Pear
    </label>
</div>

此处第三个元素标签上有v-if，加载页面时原始isRich为false。然后，在单击第三个元素之前，isRich设置为true。但auth值仍为1而不是3。

在这种情况下，如何获得3而不是1作为auth值？

Answer 1

使用v-model进行此操作。
请参阅：https://vuejs.org/v2/guide/forms.html#Radio

<div class="btn-group clearfix" data-toggle="buttons" v-radio="auth">
    <label class="btn btn-sm btn-default active">
        <input type="radio" name="auth" value="1" v-model="auth">
        Apple
    </label>
    <label class="btn btn-sm btn-default">
        <input type="radio" name="auth" value="2" v-model="auth">
        Banana
    </label>
    <label class="btn btn-sm btn-default" v-if="isRich">
        <input type="radio" name="auth" value="3" v-model="auth">
        Pear
    </label>
</div>

Vue v-radio在先前不可见的元素上

1 个答案: