Javascript 设置Vuetify复选框的初始值

我有一个Vue JS应用程序，它使用Vuetify复选框。我无法将初始值设置为选中

<v-checkbox
  v-else-if="input.type == 'checkbox'"
    false-value="0"
    true-value="1"
    v-model="input.val"
    :error-messages="form.errors[field]"
>

但这些都不会影响复选框的开始状态。如果

input.val

以

1

开头，为什么不勾选此框

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

@{{input.hint}

尝试删除

假值

和

真值

，并使用

假值

或

真值

告诉它是否应该在

值

中进行检查，如果你使用

v-bind:true-value

它工作正常。例如

示例

<div id="app">
      <v-app id="inspire">
        <v-container fluid>
          <v-checkbox v-model="checkbox1"
                        v-bind:false-value="0"
                        v-bind:true-value="1"
                      :label="`Checkbox 1: ${checkbox1.toString()}`"></v-checkbox>
          <v-checkbox v-model="checkbox2" :label="`Checkbox 2: ${checkbox2.toString()}`"></v-checkbox>
        </v-container>
      </v-app>
    </div>

new Vue({
  el: '#app',
  data () {
    return {
      checkbox1: 1,
      checkbox2: 0
    }
  }
})

新Vue({
el:“#应用程序”，
数据（）{
返回{
复选框1:1，
复选框2:0
}
}
})

既有

假值

又有

真值

属性。查看文档：我查看了文档，在常规版本或下一版本中没有看到任何属性。我猜您在访问链接后没有从下拉列表中选择“v-checkbox”。选择控件都列在该链接上，并且显示的初始道具是针对

v-radio-group

。不确定为什么您认为Vuetify中存在错误，它只需要匹配类型。没有

v-bind

时，

true值

和

false值

将被视为字符串，并且不等于数据中的数字。是的，但是如果使用

true值

和

false值

而没有绑定，则不会更新v-checkbox输入值，而不是

v-model

值。

v-model

值已更新，但输入值未更新。我不太清楚您的意思。如果不使用

v-bind

而使用

true值

和

false值

，则值将只是字符串，因此还需要将数据中的初始值设置为字符串，

复选框1:'1'

。只要所有东西都使用相同的类型，它就可以正常工作。对不起，我不准确。是的，你说得对，但没有约束力，它是字符串。对于数组，需要使用绑定的对象。

<div id="app">
      <v-app id="inspire">
        <v-container fluid>
          <v-checkbox v-model="checkbox1"
                        v-bind:false-value="0"
                        v-bind:true-value="1"
                      :label="`Checkbox 1: ${checkbox1.toString()}`"></v-checkbox>
          <v-checkbox v-model="checkbox2" :label="`Checkbox 2: ${checkbox2.toString()}`"></v-checkbox>
        </v-container>
      </v-app>
    </div>

new Vue({
  el: '#app',
  data () {
    return {
      checkbox1: 1,
      checkbox2: 0
    }
  }
})