vue3通过defineExpose 把ref绑定自定义组件的dom及方法暴露给父组件

vue3中默认父组件通过ref绑定子组件是获取不到子组件中的dom和变量、方法的,子组件需要通过defineExpose方法把需要暴露的东西暴露出去,父组件才能拿的到,实例演示一下:

子组件 Child.vue



父组件 Father.vue



打印出来是一个proxy对象,里面拿不到子组件的任何信息,通过defineExpose改造一下子组件,即可能拿到子组件里面的内容

改造子组件 Child.vue



通过上面的子组件的改造,那父组件就可以通过rChild.value.contentrChild.value.rInput拿到子组件中的content的变量及dom结构。

你可能感兴趣的:(vue3通过defineExpose 把ref绑定自定义组件的dom及方法暴露给父组件)