为Vuetify v复选框指定true / false值

时间:2019-07-04 21:22:17

标签: javascript vue.js vuejs2 vuetify.js

我正在使用Vuetify Vue.js组件v-checkbox

我想为复选框的true / false状态指定特定的值。

看着documentation,看来我可以使用true-valuefalse-value道具来做到这一点。

<v-checkbox
    v-else-if="input.type == 'checkbox'"
    false-value="0"
    true-value="1"
    input-value="input.val"
    :error-messages="form.errors[field]"
>
    <template #label>@{{ input.hint }}</template>
</v-checkbox>

但是,使用上述示例时,如果选中此复选框,则不会提交1的值。无论是否选中复选框,复选框都会提交0

我需要怎么做才能将true-value设置为1

1 个答案:

答案 0 :(得分:1)

您应使用v-model指令,而不要使用input-value道具,例如:

<v-checkbox
     v-else-if="input.type == 'checkbox'"
     false-value="0"
      true-value="1"
     v-model="input.val"
    :error-messages="form.errors[field]"
                            >
    <template #label>@{{ input.hint }}</template>
</v-checkbox>

选中此code example