vue父子组件通信

一，子组件调用父组件方法。

1,使用$emit，通过v-on,将方法传给子组件，子组件通过$emit在调用。

2,父组件通过v-bind绑定方法，传给子组件调用

3,使用$parent，子组件能直接访问整个父组件

$root 和 $parent 都能够实现访问父组件的属性和方法，两者的区别在于，如果存在多级子组件，通过parent 访问得到的是它最近一级的父组件，通过root 访问得到的是根父组件(App.vue) 所以存在组件嵌套的情况下 不要使用 $root。

二，父组件调用子组件方法。

1，通过在子组件上设置ref,父组件能通过this.$refs直接访问子组件。

2，通过$children,在通过索引找到需要的子组件，直接访问子组件。

3，通过$ref和$on结合的方式。

步骤:
⑴通过在父组件定义方法。

⑵$emit方法触发父组件定义的方法并传递参数。

⑶通过$on监听父组件上的方法，$on方法里面有回调函数能接受额外传来的参数($emit方法传来的参数) 。
https://blog.csdn.net/qq_2412...
https://www.cnblogs.com/yuzho...

参考：csdn博客
https://blog.csdn.net/alokka/article/details/87104189

三，父子组件在加载顺序问题

1,同步引入子组件。

父组件的beforeCreate、created、beforeMount--> 所有子组件的beforeCreate、created、beforeMount--> 所有子组件的mounted--> 父组件的mounted

2，异步引入子组件。

父组件的beforeCreate、created、beforeMount、mounted--> 子组件的beforeCreate、created、beforeMount、mounted

1)，无论异步引入或同步引入。父组件传props时，是通过接口异步获取的，所以获取数据会父子渲染都慢。会导致子组件的html中的模板字符串改变，created里面获取到的值却不会发生改变。(生命周期问题)
详情见https://www.cnblogs.com/golov...
或https://www.cnblogs.com/taohu...

四，路由跳转时(vue页面切换)的页面加载顺序

//假设A是当前页面，B是即将跳转的页面。
B.created()
B.beforeMount()
A.beforeDestroy()
A.destroyed()
B.mounted()