• 中文
    • English
  • 注册
    • 查看作者
    • element框架在html中让el-switch选择开关的文字显示在里面

      我想实现的效果:

      element框架在html中让el-switch选择开关的文字显示在里面

      实现代码如下:

      <style>
      .switchStyle .el-switch__label {
        position: absolute!important;
        display: none!important;
        color: #fff!important;
      }
      .switchStyle .el-switch__label--left {
        z-index: 9!important;
        left: 6px!important;
      }
      .switchStyle .el-switch__label--right {
        z-index: 9!important;
        left: -14px!important;
      }
      .switchStyle .el-switch__label.is-active {
        display: block!important;
      }
      .switchStyle.el-switch .el-switch__core,
      .el-switch .el-switch__label {
        width: 60px !important;
      }
      </style>
      <el-table-column prop="new" label="新服标识" align="center">
      	<template slot-scope="scope">
      		<el-switch
      		    class="switchStyle"
      		    active-value="1"
      		    inactive-value="0"
      		    v-model="scope.row.status"
      		    active-text="新区"
      		    inactive-text="老区"
      		    active-color="#409eff"
      		    inactive-color="#DCDFE6">
      		</el-switch>
      	</template>
      </el-table-column>

    • 0
    • 0
    • 0
    • 123
    • 请登录之后再进行评论

      登录
    • 返回顶部
    • 做任务
    • 实时动态
    • 偏好设置
    • 到底部
    • 单栏布局 侧栏位置: