作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个使用 Vuetify 复选框的 Vue JS 应用程序。我无法将初始值设置为选中。
<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
时,我希望复选框开始选中。但是,复选框不会开始选中。
我也试过添加 Prop :
:value="input.val"
:input-value="input.val"
虽然这些都不会影响复选框的起始状态。如果 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>
最佳答案
您需要对数字使用:
或v-bind
,如果您使用v-bind:true-value
就可以了美好的。示例 on codepen .
示例
<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
}
}
})
关于javascript - 设置 Vuetify 复选框的初始值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56918647/
我是一名优秀的程序员,十分优秀!