import和$refs的区别

Question

通过es6语法
import A from A
和$refs语法糖
this.$refs.A

这两个拿到的值有什么区别

Answer 1

这两个有什么相同的地方？不理解你要比什么

this.$refs.canvasA获取到的是<canvas ref="canvasA" id="canvasB">这个东西。如果用 jquery 就是$('#canvasB')，用js大概就是document.querySelector('#canvasB')。
当然 $refs 肯定还是有特别的地方，如果 ref 绑定在组件上<el-input ref="inputA">，this.$refs.inputA 获取到的就不是 DOM，而是组件实例。
https://cn.vuejs.org/v2/api/#...

import 的话，导出的是一个对象。

---

em.... 我知道你什么意思了。你想知道下面这两个是什么关系？

1. import componentA from A 中的 componentA
2. <componentA ref="refA"> 中的 refA

那这样看你懂了吗？

componentA = {
    el: '#app',
    data(){return{author:'li'}}
}
refA = new Vue(componentA)

Answer 2

不管拿到的东西长的是不是很像，或者一毛一样，这两个东西没有一毛钱关系；

import 只有node 认识，浏览器不认识，是编译前供开发人员方便开发而使用的语法，必须经过webpack编译成浏览器认识的语法才能执行;

$refs那个是vue的语法，是vue暴露出来的方法，为了方便拿到子组件实例或者元素，只要页面加载了vue.js，就可以正常使用。

所以这两个语法作用不在一个领域，没有可比性。

不知道你问的是不是这个问题，我要理解错了就当没看见：)