Vue prevents change event from bubbling

1. Problem description

Clicking the switch will trigger the click event of the parent's collapse panel and then expand the panel. Because of business needs, we want to separate the two events. The solution is to prevent the change event from bubbling.
insert image description here

Two, the solution

The parent can be solved by adding the @click.stop modifier

					<div class="switchStyle" @click.stop>
                      <div class="formLabel">海域确权</div>
                      <el-switch
                        v-model="switchVal1"
                        active-color="#13ce66"
                        inactive-color="#B6B6B6"
                        @change="(val) => handleSwitchAddLayer(val, 1)"
                      />
                    </div>

Guess you like

Origin blog.csdn.net/weixin_45150813/article/details/126224273