element组件库-el-switch组件 .stop修饰符不生效问题(阻止不了事件冒泡)

代码

视图

问题所在

给外面大的div添加点击事件打开dialog，没问题，点击switch组件不希望打开dialog，但是现在点击switch组件也打开dialog了，肯定有问题，第一反应肯定是事件冒泡了，当触发了switch的事件，事件向外冒泡，又触发了父组件的事件。所以使用stop修饰符，组件事件冒泡即可。

• 给change加.stop修饰符 阻止时间冒泡 不生效
• 然后又换成click事件 还是不生效 其实el组件只提供了change事件 当时就想试试 还是不行
• 然后我把switch换成按钮 给按钮加了.stop修饰符 看看点击按钮会不会打开dialog 结果是不会
• 然后发现这个是el-switch组件不支持直接@事件.stop的写法

正确写法

在switch外层套一层div 在div上写 @click.stop 既可阻止时间冒泡