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>
相关推荐
NoneCoder33 分钟前
JavaScript系列(26)--安全编程实践详解
开发语言·javascript·安全
杨荧1 小时前
【开源免费】基于Vue和SpringBoot的林业产品推荐系统(附论文)
前端·javascript·vue.js·spring boot·开源
宏夏c1 小时前
【Vue】let、const、var的区别、适用场景
开发语言·javascript·ecmascript
光影少年1 小时前
前端进程和线程及介绍
前端·javascript
涔溪1 小时前
JS二叉树是什么?二叉树的特性
java·javascript·数据结构
贩卖纯净水.1 小时前
JS后盾人--再一次的走进JS?
开发语言·javascript·ecmascript
Franciz小测测1 小时前
VUE3 + Ant Design Vue4 开发笔记
前端·vue.js·vue
Swing_wingS2 小时前
SpringMvc解决跨域问题的源码汇总。
前端
乌龟的黑头-阿尔及利亚2 小时前
使用 Vite 创建 Vue 3 项目:从零开始的详细指南
前端·javascript·vue.js