element中el-switch的v-model自定义值的实现
作者:老马甲
在el-switch中设置active-value和inactive-value属性,接受Boolean, String或Number类型的值,本文就来介绍一下element中el-switch的v-model自定义值的实现,感兴趣的可以了解一下
一、问题
element中的el-switch的值默认都是true或false,但是有些时候后端接口该字段可能是0或者1,如果说再转换一次值,那就有点太费力了。如下所示:
<template>
<el-switch
inactive-text="否"
active-text="是"
v-model="status"
@change="changeSwitch"
/>
</template>
<script>
export default {
data() {
return {
status: false
}
},
methods: {
changeSwitch(e) {
console.info(e)
}
}
}
</script>

二、解决
在el-switch中设置active-value和inactive-value属性,接受Boolean, String或Number类型的值
<el-switch
inactive-text="否"
active-text="是"
active-value="1"
inactive-value="0"
v-model="status"
/>

三、官方文档

到此这篇关于element中el-switch的v-model自定义值的实现的文章就介绍到这了,更多相关element el-switch v-model自定义值内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
