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>
相关推荐
han_16 分钟前
JavaScript设计模式(十):模板方法模式实现与应用
前端·javascript·设计模式
二进制person18 分钟前
JavaEE进阶 --HTML+CSS+JavaScript 基础
javascript·css·html
得物技术19 分钟前
立正请站好:一个组件复用 Skill 的工程化实践|得物技术
前端·架构·ai编程
fīɡЙtīиɡ ℡26 分钟前
【SpringAi最新版入门(二)】
java·javascript·css·人工智能·css3
攀登的牵牛花27 分钟前
OpenClaw 的内心独白,关于最近很火的Harness?
前端·openai
浩星28 分钟前
electron系列8之Electron + Vue 3:构建现代化桌面应用(下)
前端·vue.js·electron
西西学代码30 分钟前
查找设备页面(amap_map)
开发语言·前端·javascript
浩星37 分钟前
electron系列7之Electron + Vue 3:构建现代化桌面应用(上)
javascript·vue.js·electron
m0_7381207237 分钟前
渗透测试基础ctfshow——Web应用安全与防护(四)
前端·安全·web安全·网络安全·flask·弱口令爆破
似水流年QC44 分钟前
Chrome Performance 面板前端性能分析从入门到实战
前端·chrome