关于解决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>
相关推荐
冴羽44 分钟前
2026 年 Web 前端开发的 8 个趋势!
前端·javascript·vue.js
五仁火烧1 小时前
Vue3 项目的默认端口行为
服务器·vue.js·nginx·容器·vue
fengbizhe1 小时前
bootstrapTable转DataTables,并给有着tfoot的DataTables加滚动条
javascript·bootstrap
刘一说1 小时前
TypeScript 与 JavaScript:现代前端开发的双子星
javascript·ubuntu·typescript
EndingCoder2 小时前
类的继承和多态
linux·运维·前端·javascript·ubuntu·typescript
用户47949283569152 小时前
React 终于出手了:彻底终结 useEffect 的"闭包陷阱"
前端·javascript·react.js
Younglina2 小时前
一个纯前端的网站集合管理工具
前端·vue.js·chrome
木头程序员2 小时前
前端(包含HTML/JavaScript/DOM/BOM/jQuery)基础-暴力复习篇
开发语言·前端·javascript·ecmascript·es6·jquery·html5
哈__3 小时前
React Native 鸿蒙跨平台开发:PixelRatio 实现鸿蒙端图片的高清显示
javascript·react native·react.js
wszy18093 小时前
外部链接跳转:从 App 打开浏览器的正确姿势
java·javascript·react native·react.js·harmonyos