<template>
<div style='margin:20px'>
<el-switch
v-model="value1"
active-text="是"
inactive-color="#BFBFBF"
inactive-text="否"
active-value="1"
inactive-value="0"
@change="test" />
</div>
</template>
<script>
export default {
data(){
return {
value1: true,
}
}
}
</script>
<style>
.el-switch__label {
position: absolute;
display: none;
font-size: 11px !important;
color: #fff!important;
}
.el-switch__label *{
font-size: 11px !important;
}
/*打开时文字位置设置*/
.el-switch__label--right {
z-index: 1;
right: 21px;
top: 0.5px;
}
/*关闭时文字位置设置*/
.el-switch__label--left {
z-index: 1;
left: 23px;
top: 0.5px;
}
/*显示文字*/
.el-switch__label.is-active {
display: block;
}
.el-switch__core {
width: 45px;
height: 22px;
border: 2px solid #DCDFE6;
border-radius: 13px;
}
</style>