<el-popconfirm> + <el-switch>应用
业务场景,点击音讯告诉开关之后switch的状态仍然是蓝色(open状态),跳出一个弹出确认的窗口,当点击确认后,确认窗口敞开,switch状态变为灰色
重点是管制switch
应用<el-switch>+<el-popconfirm>来实现下面场景的交互。重点是管制el-switch的状态(即何时扭转el-switch的数据)
1、将el-switch的v-model 换成:value,让数据单向流动,这样点击el-switch的时候就不会间接批改el-switch的绑定值。(不会变为灰色)。
2、用el-popconfirm包裹el-switch。留神element-ui的版本,晚期版本的element-ui用的是onConfirm事件,前期改成了confrim事件。
参见此文[《[Vue] el-popconfirm confirm事件生效》](https://segmentfault.com/a/1190000042028689)
到这里曾经实现了当点击确认后,确认窗口敞开,switch状态变为灰色。
想做的更好,还能够往下实现仅在switch由 true 变成 false的时候呈现el-popconfirm的弹窗二次确认。 (实现这个要求须要一点巧思)
完结。
同步更新到本人的语雀
https://www.yuque.com/dirackeeko/blog/yp0ugx1zgirlpl0p