vue组件里用了插槽父子组件怎么传值

Question

百度了一下有点云里雾里
有三个组件，如下。我想要option组件往select传个值做处理，本来只要emit一下就好，但是因为用了slot的缘故，option组件在index里此时option要怎么传值给select，相同的select组件的值怎么传给option，感谢

index页面
<w-select v-model="selectValue">
    <!--这个option组件是向select组件里slot插入的内容，这里插入一个组件-->
    <w-option v-for="selectList" :key="item.value" :label="item.lable" :value="item.value"></w-option>
</w-select>

select组件
<div class="w-select">
        <!--这里是上面index插到这里的slot位置-->
        <slot></slot>
</div>


option组件
//这个组件只做了一件事就是向select组件传一个值去做处理
methods:{
    test(){
        this.$emit('value',this.value)
    }
}

Answer 1

1、存在插槽内嵌的话，比如问题的例子，w-option 的父级/父组件就是 w-select。
2、没有插槽，就更明显了，引入的组件就是子组件
如果实在不清除，可以直接通过 console.log(this.$parent,this.$children) 查看对应的子级和父级。
而且也可以直接通过更改 this.$parent,this.$children 里面的数值来达到传值的效果