element-plus中使用el-switch时,用‘0,1’或者0,1来代替true,false绑定

介绍

switch 开关默认用 true, false来绑定的,但是在实际的项目中,有时候根据后端的接口返回,也可能会用字符串01 ,或者数字 0,1来代替; 具体实现如下
详情: 主要实现方式是通过使用el-switch组件里的 active-valueinactive-value 属性来实现;

  1. 默认的使用方式:通过boolean(布尔类型)来控制开关,代码如下:
<el-switch v-model="value1" />
<script setup>
	import { ref } from 'vue'
	const value1 = ref(true);
</script>
  1. 使用 number 类型来控制开关,代码如下:
<el-switch v-model="value1"
  :active-value="1"
  :inactive-value="0"
  />
<script setup>
	import { ref } from 'vue'
	const value1 = ref(1);
</script>
  1. 使用 String 类型来控制开关,代码如下:
<el-switch v-model="value1"
  active-value="1"
  inactive-value="0"
  />
<script setup>
	import { ref } from 'vue'
	const value1 = ref('1');
</script>

总结

  1. switch 开关默认用 布尔类型:true, false来绑定的
  2. Number 类型的值 active-valueinactive-value 前面要加 冒号
  3. String 类型的值 active-valueinactive-value 前面不用加 冒号
  • 6
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值