vue2升级到vue3中，原vue2中的通过this.$refs.detailchid.$children[0].$children[0].xxx去获取后代的组件的数据，$refs.detailchid是从依赖中进行全局注册的组件，其内部组件无法更改，无法通过provide 和 inject，也无法通过vuex等方式去获取数据， 现在有什么办法拿到后代组件的数据吗？后代组件仍然是vue2写法暴露出来的，没有使用setup，也没有使用一些vue3不兼容的语法
<template>
<div>
<childcomponent ref="detailchild" />
</div>
</template>
<script>
import { ref, onmounted } from 'vue';
import childcomponent from './childcomponent.vue';
export default {
components: {
childcomponent
},
setup() {
const detailchild = ref(null);
onmounted(() => {
// 访问子组件的方法或数据
if (detailchild.value) {
// 假设子组件有一个方法叫 dosomething()
detailchild.value.dosomething();
}
});
return {
detailchild
};
}
};
</script>然后直接在子组件里定义dosomething输出子组件的对应数据就好了，而且本身不能使用 provide 和 inject就不合理，属于是组件定义上就有问题了。最节省的方法就直接定义个事件总线。
请登录
推荐文章：