element plus的switch开关回显

element plus的switch开关通过 :model-value="" 是绑定值,必须等于 active-valueinactive-value,默认为 Boolean 类型

:active-value="2" 是switch 状态为 on 时的值

:inactive-value="1" 是switch的状态为 off 时的值

javascript 复制代码
<template>
  <el-tooltip :content="'Switch value: ' + value" placement="top">
    <el-switch
      v-model="value"
      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
      active-value="100"
      inactive-value="0"
    />
  </el-tooltip>
</template>

<script lang="ts" setup>
import { ref } from 'vue'

const value = ref('100')
</script>
相关推荐
qq_12498707539 小时前
基于Javaweb的《战舰世界》游戏百科信息系统(源码+论文+部署+安装)
java·vue.js·人工智能·spring boot·游戏·毕业设计·计算机毕业设计
铅笔侠_小龙虾9 小时前
浅谈 Vue & React & Flutter 框架
vue.js·flutter·react.js
We་ct9 小时前
LeetCode 202. 快乐数:题解+思路拆解
前端·算法·leetcode·typescript
HWL56799 小时前
控制浏览器如何预先加载视频资源
java·服务器·前端
HWL56799 小时前
在网页中实现WebM格式视频自动循环播放
前端·css·html·excel·音视频
嵌入式×边缘AI:打怪升级日志9 小时前
从设备接收请求的状态机与超时机制
服务器·前端
鸡吃丸子9 小时前
前端视角下的埋点:实操指南与避坑要点
前端
前端摸鱼匠9 小时前
Vue 3 的ref在响应式对象中:介绍ref在reactive对象中的自动解包
前端·javascript·vue.js·前端框架·ecmascript
HWL56799 小时前
防止移动设备自动全屏播放视频,让视频在页面内嵌位置正常播放
前端·css·音视频
Polaris_YJH9 小时前
使用Vue3+Vite+Pinia+elementUI搭建初级企业级项目
前端·javascript·elementui·vue