看代码
问题出现了 当我想要获取这个组件上的方法时
为什么获取不到这个组件上的方法呢
原來:
__v_skip: true
是 Vue 3 中的一个特殊属性,用于跳过某些组件的渲染。当一个组件被标记为 __v_skip: true
时,Vue 将不会对该组件进行渲染,也不会将其添加到虚拟 DOM 树中。因此,使用 ref
获取该组件的显示时,将无法获取到该组件上的方法。
如果你想获取子组件上的方法,需要确保子组件没有被标记为 __v_skip: true
。如果子组件被标记为 __v_skip: true
,则无法通过 ref
获取其方法。
要解决Vue 3中使用ref
无法获取子组件方法的问题,可以采取以下几个步骤:
- 使用
defineExpose
:在子组件中,您需要使用defineExpose
来暴露子组件的方法。这样,父组件才能通过ref
访问到这些方法。 - 父组件中引用子组件:在父组件中,您应该使用
ref
属性来引用子组件的实例。这样,您就可以通过这个引用来调用子组件的方法。 - 调用子组件方法:一旦子组件的方法被暴露,并且父组件有了对子组件实例的引用,您就可以直接调用子组件的方法了。例如,如果您在子组件中暴露了一个名为
myMethod
的方法,那么在父组件中,您可以使用childComponentRef.value.myMethod()
来调用它。
于是我查看了一下子组件 由于我是用的语法糖写的 没有进行抛出 所以就有了拿不到的这个问题 上图看一下吧
那这种语法糖怎么抛出呢 就到了今天解决问题的关键 defineExpose
将你子组件中的这个方法进行抛出 父组件就可以拿到啦 现在让我来看一下打印的效果吧~
okok~今天的问题就到这啦~~~~~过38节日去啦