$chlidren 与 $parent
Children 用于父组件访问子组件。parent用于子组件访问父组件。
//父组件
click(){
console.log(this.$children[1].text)
}
//子组件
click() {
console.log(this.$parent.text);
}
需要注意的是children 拿到的是当前组件的子组件数组,所以我们需要像使用数组一样使用。但是children并不保证组件的顺序。
所以,这两种方式在以后的开发中几乎很少使用。我们也并不希望组件数据可以随意跨组件访问。
$root
返回当前组件的根组件,如果没有,返回组件本身。
…本人压根没用过。
$refs
相对于上面的几项,这个相对来讲使用的最多了。
我们可以吧$refs看做是一个当前vue项目的全局对象,对象中存放的是所有拥有ref属性的Dom节点和组件。我们可以通过改对象,直接调用这些组件或者是组件中的data和方法。
当我们使用ref获取dom节点进行操作时,有时不见得能拿到,我们可以在vue的nextTick中使用即可。
click(){
console.log(this.$refs.aaa.namej)
aaa是ref属性值为aaa的组件或者dom节点。
}