【问题标题】:Specifying true/false values for a Vuetify v-checkbox为 Vuetify v-checkbox 指定真/假值
【发布时间】:2019-11-15 13:44:10
【问题描述】:

我正在使用 Vuetify 组件v-checkbox

我想为复选框的真/假状态指定特定值。

看看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>
但是,使用上面的示例不会在选中复选框时提交@ 987654326的值。无论复选框是否被选中,复选框都会提交0

我需要做什么才能将true-value 正确设置为1

【问题讨论】:

  • Vuetify 文档说 input-value 属性应该是 The v-model bound value
  • 问题是你使用了input-value而不是:input-value(注意:)。 input-value 属性存在。

标签: javascript vue.js vuejs2 vue-component vuetify.js


【解决方案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

【讨论】:

  • 进行此更改后,我无法再设置复选框的初始值。我希望如果“input.val”是“1”,那么复选框将开始被选中。为什么'input.val'不勾选?
  • 是的。这修复了复选框的真/假值。即它在选中时提交 1,在未选中时提交 0。但是,这仅在未选中该框开始时才有效。如果'input.val'在组件渲染时已经等于'1',它不会启动复选框关闭检查...
猜你喜欢
  • 1970-01-01
  • 2018-11-03
  • 1970-01-01
  • 1970-01-01
  • 2022-01-23
  • 2020-03-30
  • 2019-09-27
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多