这篇博客介绍了在Vue.js中使用El-Checkbox组件时,如何设置和处理`v-model`的布尔值和类型转换。通过示例代码展示了如何设置`true-label`和`false-label`属性来改变选中状态的值,适用于需要特定类型(如字符串或整数)的场景。
v-model不能直接写正则表达式
比如:
let grpItemsItem={itemStatus:0};
v-model="grpItemsItem.itemStatus==0 ? false : true"
打印grpItemsItem对象的结果是:itemStatus==0 ? false : true
正确使用方式如下,
<template><!-- `checked` 为 true 或 false --><el-checkbox v-model="checked">备选项</el-checkbox>
</template>
<script>export default {data() {return {checked: true};}};
</script>
字符串
<el-checkbox v-model='checked' true-label='1' false-label='0'>备选项</el-checkbox>
int类型
<el-checkbox v-model='checked' :true-label=1 :false-label=0>备选项</el-checkbox>