多层组件数据传递

在 Vue 的模板机制下，有些时候，我们不得不写一些“碎片组件”，即很小的组件，也没什么功能，只是为完成特定的渲染，或者作为其它组件的 slot 存在。

这种时候，如何在长长的组件链 a -> b -> c -> d -> e 中传递数据就值得我们思考了。通常来说，有三种方式：

1. v-model 或 props.sync
2. 全局事件总线
3. Vuex

第一种方式，如果组件比较简单，并且复用性不强，直接共用变量方便省事。但是如果某个组件在这个链条之外也有用处，就很容易出问题。可以用，但最好加个 // TODO 记下来，将来作为重构的点。

第二种方式，配合生命周期钩子，可以比较方便的初始化数据和更新数据，大多数情况下够用。不过手动管理事件也是隐患，而且这种情况的数据共享没有响应式，所以不推荐。

第三种方式是目前实践中最为推荐的状态管理。它有以下优点：

1. 数据是响应式
2. 组件解耦
3. 支持命名空间

唯一的缺点，就是写起来比较麻烦。