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>
相关推荐
悲且狂3 分钟前
vue辅助工具(vue系列二)
前端·javascript·vue.js
牧码岛28 分钟前
Web前端之Vue+Element实现表格动态不同列合并多行、localeCompare、forEach、table、push、sort、Map
前端·javascript·elementui·vue·web·web前端
老K(郭云开)31 分钟前
如何让eDrawings html文件在Chrome浏览器上展示——allWebPlugin中间件扩展
前端·javascript·chrome·中间件·edge·html
point_zg1 小时前
Vue报错...properly without JavaScript enabled. Please enable it to continue
开发语言·javascript·vue
DCTANT1 小时前
【原创】vue-element-admin-plus完成确认密码功能,并实时获取Form中表单字段中的值
前端·javascript·vue.js·elementui·typescript
汪子熙1 小时前
使用 Trae 开发一个演示勾股定理的动画演示
前端·人工智能·trae
GISer_Jing1 小时前
字符串操作&栈和队列
前端·javascript
黑土豆2 小时前
TypeScript技术系列13:深入理解配置文件tsconfig.json
前端·javascript·typescript
zheshiyangyang2 小时前
JavaScript---原型和原型链
开发语言·前端·javascript
momo_养身版2 小时前
Browser use — 利用 AI 操作浏览器 · 原理篇
前端·openai