這篇博客介紹了在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>