分分钟玩转Vue.js组件（二）-创新互联

概述

上一篇分分钟玩转Vue.js组件中我们重点介绍了组件的创建、注册和使用，熟练这几个步骤将有助于深入组件的开发。另外，在子组件中定义props，可以让父组件的数据传递下来，这就好比子组件告诉父组件：“嘿，老哥，我开通了一个驿站，你把东西放到驿站我就可以拿到了。”

今天我们将着重介绍slot和父子组件之间的访问和通信，slot是一个非常有用的东西，它相当于一个内容插槽，它是我们重用组件的基础。Vue的事件系统独立于原生的DOM事件，它用于组件之间的通信。

本文的主要内容如下：

• 组件的编译作用域
• 在组件template中使用标签作为内容插槽
• 使用$children, $refs, $parent 实现父子组件之间的实例访问
• 在子组件中，使用$dispatch向父组件派发事件；在父组件中，使用$broadcast向子组件传播事件
• 结合这些基础知识，我们一步一步实现一个CURD的示例

Demo和源代码已放到GitHub，如果您觉得本篇内容不错，请点个赞，或在GitHub上加个星星！

对话框组件示例1对话框组件示例2 对话框组件示例3 派发事件示例 广播事件示例 CURD示例 GitHub Source

注意：以下示例的组件模板都定义在