vue父子组件

vue父子组件

新建 模板 小书匠 

为什么要厘清哪个是父组件，哪个是子组件？

一开始浏览器接收和要显示的数据非常少，此时无需划分区域进行布局。随着页面数据量的增加，如果单纯一个窗口来加载和显示数据，是非常缓慢的。此时将主页面充当父组件中转，分发到子组件，将会大大降低父组件的压力。

你可以想象你开了一个小餐馆，自己可以充当厨师，收银员和后勤进货。当小餐馆逐渐变成大酒店后，一个人是无法再兼任多职了。厨师可能还要分主厨，配菜，热炒，打荷等。这些厨师如果不分清上下级，命令就无法有效抵达。

所以就有必要分清父子组件了，笼统来说，父是包含子的，当然vue也是这样设计组件的。vue实例是最顶级的组件，它的components属性里包含mycpn组件,所以vue是mycpn的父组件，mycpn是vue的子组件。它们之间可以相互传递消息。即上述的酒店模型的上下级指令传达。

当一个组件的components属性里包含另外一个组件时，该组件就是另外组件的父组件

子组件还能有子组件，即当子组件内的components属性包含其他组件时，该子组件为其他组件的父组件。

顶级组件vue的components属性包含mycpn组件,mycpn组件的components属性又包含mychildcpn组件

如果对模板嵌套糊涂的同学请参考模板优化及局部注册组件语法糖等章节进行知识回顾。

请务必理解相关语法糖，为接下来的父子通信做铺垫。

https://www.cnblogs.com/singledogpro/p/12056925.html vue组件化之模板优化及注册组件语法糖