关于解决switch开关属性中active-value=“1“为数值形失败的问题

问题详述

如下列代码中,我想让switch打开的值(active-value)和switch关闭的值(inactive-value)都取成数值形,但是目前是把属性设置为字符串"1"。

因为等号右边的内容是包含在引号中的,所以Vue会将其视为字符串。

javascript 复制代码
       <el-table-column label="状态" align="center" width="80">
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.onlineStatus"
              active-value= "1"
              inactive-value= "0"
              @change="handleStatusChange(scope.row)"
              v-hasPermi="['net:gw:switchStatus']"
            ></el-switch>
          </template>
        </el-table-column>

解决办法

把active-value = "1"前面加上":"号,即:active-value= "1"。

这将属性值设置为数值1,冒号表示这是一个动态绑定,Vue会将等号右边的内容作为javascript代码进行解析,所以1被视为数值。

javascript 复制代码
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.onlineStatus"
              :active-value= "1"
              :inactive-value= "0"
              @change="handleStatusChange(scope.row)"
              v-hasPermi="['net:gw:switchStatus']"
            ></el-switch>
          </template>
相关推荐
Liu.7742 小时前
vue3 中实现 Element Plus 表格合并
javascript·vue.js·elementui
SevgiliD2 小时前
解决使用 fixed固定列时el-table导致纵向滚动条问题
前端·vue.js·elementui
bitbitDown3 小时前
忍了一年多,我终于对i18n下手了
前端·javascript·架构
Hilaku3 小时前
前端的单元测试,大部分都是在自欺欺人
前端·javascript·单元测试
用户47949283569153 小时前
一道原型链面试题引发的血案:为什么90%的人都答错了
前端·javascript·面试
Mintopia3 小时前
🧭 新一代 Next.js App Router 下的 Route Handlers —— 从原理到优雅实践
前端·javascript·next.js
一枚前端小能手3 小时前
🔥 字符串处理又踩坑了?JavaScript字符串方法全攻略,这些技巧让你效率翻倍
前端·javascript
叫我詹躲躲3 小时前
别再手写正则了!20 + 证件 / 手机号 / 邮箱验证函数,直接复制能用
前端·javascript·正则表达式
猪哥帅过吴彦祖3 小时前
第 4 篇:赋予表面生命 - WebGL 纹理贴图
前端·javascript·webgl