element下拉选择器冒泡问题

Question

elementUI多选框里嵌套了select选择器，发现点击select的下拉按钮会使外层多选框进行反选，怀疑是下拉按钮的冒泡问题，是这样吗？需要修改源码吗？不修改的话要怎么弄呢？

感谢大家指导

  <el-checkbox v-model="hiddenChecked">隐患未完成整改达到
        <el-input v-model="hidden" :disabled="!hiddenChecked"></el-input>个，且持续时间达到
        <el-input v-model="hiddenTime" :disabled="!hiddenChecked"></el-input>
        <el-select v-model="hidden_dateValue" :disabled="!hiddenChecked">
            <el-option
                    v-for="item in dateOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
            </el-option>
        </el-select>
    </el-checkbox>

    dateOptions:[{
        value: '0',
        label: '时'
    }, {
        value: '1',
        label: '日'
    }]

Answer 1

<el-checkbox v-model="hiddenChecked">隐患未完成整改达到
        <el-input v-model="hidden" :disabled="!hiddenChecked"></el-input>个，且持续时间达到
        <el-input v-model="hiddenTime" :disabled="!hiddenChecked"></el-input>
        <el-select
            v-model="hidden_dateValue"
            :disabled="!hiddenChecked"
            @click.native="(e) => {
                e.preventDefault()
            }">
            <el-option
                    v-for="item in dateOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
            </el-option>
        </el-select>
    </el-checkbox>

Answer 2

触发了checkbox的默认点击事件导致的，你可不可以考虑不把这个select放到checkbox里？

Answer 3

你把input、 select框等放入checkbox中，讲道理你点击里面子元素，就会向上冒泡的，比如你点击且持续时间达到这段文字，也会使外层多选框进行反选的

所以这里，最好是考虑不放在checkbox中吧

如果遇到嵌套组件需要阻止冒泡，可以在内层的组件上加上@click.stop.native