Vue2：$refs

$refs是一个对象，属性名就是绑定在模板中的ref值

<div ref="xx"></div>

 

1、this.$refs代替了DOM的元素获取操作

例：

var div= this.$refs.div ==》 var div= document.querySelector("div ")

 

 $root: 访问根组件vm对象,所有的子组件都可以将这个实例作为一个全局 store 来访问或使用,现在有更好的技术vuex代替。
 
 $parent:访问父组件对象,直接操作父组件的data数据,不需要再使用属性传值,但是容易出现渲染混乱之后只渲染一个的情况
 
 $children:访问子组件对象数组,不能保证顺序,也不是响应式的
          
 $refs:只会在组件渲染完成之后生效，并且它们不是响应式的。你应该避免在模板或计算属性中访问 $refs。
 
 //在组件或者原生元素绑定ref属性(类似于id):
 <myinput ref="myInput1"></myinput>
 <input ref="myInput2"></input>
 
 //在父组件中可以通过 this.$refs访问到它:
 methods: {
   focus: function () {
     this.$refs.myInput2.focus()
   }
 }