ref，$children, $parent

ref

可以获取到真是的DOM，也可以获取到子组件的实例（操作子组件的数据与方法）

<button @cilck="btnClick">子组件加1</button>
<button @click="$ref.one.getdata()">调用one方法</button>
<child1 ref="one"></child1>
<child2 ref="two"></child2>


btnClick(){
// 操作数据
    this.$refs.one.num +1
    this.$refs.two.num +1
}

$children

可以获取到当前组件的所有子组件(操作子组件的数据与方法)

<button @cilck="btnClick">子组件加1</button>
<button>调用one方法</button>
<child1></child1>
<child2></child2>

btnClick(){
    this.$children.forEach(item => item.num++)
}

$parent

1. $parent 既 可 以 接 受 父 组 件 数 据 ， 又 可 以 修 改 父 组 件 数 据， 是 双 向 的
2. $parent 可以调用父组件的方法

btnclick(){
    //获取父组件name值 
    console.log(this.$parent.name);
    //修改父组件name值 this.$parent.name ="ssss"; 
    this.$parent.parentPrint();
}