AI智能
改变未来

ElementUI中switch开关的使用–关于如何把文字显示在按钮上

先上图:

拿走说一声:拒绝伸手党!!!!!

先定义class:

<el-switch  class=\"tablescope\"@change=\"handleStatusChange(scope.$index, scope.row)\":active-value=\"1\":inactive-value=\"0\"v-model=\"scope.row.status\"inactive-text=\"否\"active-text=\"是\"></el-switch>

然后重点: style上不要加 scoped 了
上样式:

<style lang=\"scss\">.tablescope{.el-switch__label--left {position: relative;left: 45px;color: #fff;z-index: -1111;}.el-switch__core{width: 50px !important;}.el-switch__label--right {position: relative;right: 46px;color: #fff;z-index: -1111;}.el-switch__label--right.is-active {z-index: 1111;color: #fff !important;}.el-switch__label--left.is-active {z-index: 1111;color: #9c9c9c !important;}}</style>

有什么问题欢迎指正!!!大佬勿喷。。。

赞(0) 打赏
未经允许不得转载:爱站程序员基地 » ElementUI中switch开关的使用–关于如何把文字显示在按钮上