思路:通过change点击事件,value1开关 监听 value2开关的value值,来实现项目依赖的效果!
代码: 在线运行
<template>
<el-switch
v-model="value1"
:active-value="'day'"
:inactive-value="'weekly'"
:active-text="value1 === 'day' ? '每日' : '每周'"
@change="handleFrequency"
>
</el-switch> <br/>
<el-switch
v-model="value2"
:active-value="true"
:inactive-value="false"
:active-text="value2 ? '是' : '否'"
@change="handleFirm"
>
</el-switch>
</template>
<script>
data() {
return {
value1: 'day', // 开启关闭除了可以传true/false, 还可以这样传
value2: true
}
},
methods: {
handleFrequency(){// 按钮2在按钮1关闭状态下,才可改动
if(this.value2 === true) this.value1 = 'day';
},
handleFirm(){ // 按钮2打开后,按钮1自动打开
this.value1 = 'day'
},
}
</script>