关于 vue $refs 获取组件 this 指向的疑问

Question

在使用 vue-seamless-scroll 组件的时候发现
父级页面 使用

<vue-seamless-scroll ref="seamlessScroll"><vue-seamless-scroll>

获取的 this.$refs.seamlessScroll

和在源码 mounted 打印的 this 竟然不一样...

是我理解错两个定义了吗 不应该是指向同一个组件吗,懵了 求大佬~~

Answer 1

求大佬解释下这个问题 我其他自定义的组件打印的 this 指向都是一样的 uid 也一样 ,
有没有大佬研究过他的源码的 在线等!

Answer 2

this.$refs.seamlessScroll指向的是vue-seamless-scroll这个组件实例，如果添加到DOM元素上，则指的是该DOM元素，与this是不一样的，详见vm.$refs用法。

Answer 3

大概解释一下这个图，同一个组件被引用了2次， 上面两个 log 是 组件内部的 this
下面两个 log 是分别用 ref 打印的 this

_uid 有2份

我想表达的是： uid 是在组件挂载时生成的， 如果组件只挂载一次 显然 组件内部 this 跟外部 ref 调用是一致的，此时指向同一个组件

但是，当组件被多次挂载，每次都是一个新的实例（新的 _uid），这时候就会出现可能的不一致