vue中el-checkbox、el-switch绑定值问题详解
作者：司徒小北
这篇文章主要给大家介绍了关于vue中el-checkbox、el-switch绑定值问题的相关资料,文中通过代码介绍的非常详细,对大家学习或者使用vue具有一定的参考借鉴价值,需要的朋友可以参考下
一、el-checkbox绑定值用0 1表示
注：增加两个属性值即可 :true-label="1" :false-label="0"
// v-model="item.status" item.status如果是1表示true，0表示false <el-checkbox :true-label="1" :false-label="0" v-model="item.status"></el-checkbox>
二、el-switch值true、false改为number类型的1和0
后端返回的值为1（number类型）对应el-switch值true（打开）状态，值为0（number类型）对应el-switch值false（关闭）状态。
<el-switch :active-value="1" :inactive-value="0" v-model="item.status"> </el-switch>
举例：
<template>
<div>
<div v-for="(item, index) in collapseList" :key="index">
<el-checkbox :true-label="1" :false-label="0" v-model="item.status">备选项</el-checkbox>
<el-switch :active-value="1" :inactive-value="0" v-model="item.status"></el-switch>
</div>
</div>
</template>
<script>
export default {
data() {
return {
collapseList: [{ status: 1 }, { status: 0 }]
};
},
methods: {}
};
</script>
<style lang="less">
</style>
显示效果：
总结
到此这篇关于vue中el-checkbox、el-switch绑定值问题的文章就介绍到这了,更多相关vue el-checkbox、el-switch绑定值内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！