How does vue stop bubbling events?


    <el-checkbox style="width: 100%;height: 45px" v-for="(element,index) in formThead" :key="index" :label="element.value" @change="test1()">
                                <el-slider v-model="element.width" :max="200" style="margin-bottom: -30px;margin-left: 100px;width: 450px" show-input @change.stop="test2()" ></el-slider>
                                {{element.label}}
                            </el-checkbox>

how can I put an el-slider in my el-checkbox to stop bubbles? the stop searched on the Internet does not work

How should I write

?

Javascript element-ui vue.js
Apr.07,2021

the problem is here
in label
clipboard.png
this should not be easy to change. Make your own wheel

.

finally accidentally solved

A layer of label is placed on the outer layer of the el-slider so that it does not start the event of the label where the check-box is located 

    <el-checkbox-group v-model="formTheadData"  >

                    <draggable v-model="formThead" >

                        <el-checkbox style="width: 100%;height: 45px" v-for="(element,index) in formThead" :key="index"
                                     :label="element.value" @change="test1">

                            <label>

                                <el-slider v-model="element.width" :max="200" style="margin-bottom: -30px;margin-left: 32%;width: 400px"  show-input @change="test1"></el-slider>

                            </label>
                            {{element.label}}

                        </el-checkbox>



                    </draggable>

                </el-checkbox-group>

Thank you @ zhanggy for the fact that the problem is on label, not event bubbling

show-input set to false. This change event is the native event generated by the input inside. The change event on el-slider is a custom event, and there is no event propagation.

Previous: How webrtc sets the number of ice connection attempts

Next: Advantages and disadvantages of aspectj, asm and javassist

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1e447a0-44ac6.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1e447a0-44ac6.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?