vue中如何编写可复用的组件?

vue中如何编写可复用的组件?
1、组件命名
组件的命名应该跟业务无关。应该依据组件的功能为组件命名。
​2、组件业务数据无关
可复用组件只负责 UI 上的展示和一些交互以及动画，如何获取数据跟它无关，因此不要在组件内部去获取数据，以及任何与服务端打交道的操作。可复用组件只实现 UI 相关的功能。
​3、组件职责
约束好组件的职责，能让组件更好地解耦，知道什么功能是组件实现的，什么功能不需要实现。
组件可以分为通用组件（可复用组件）和业务组件（一次性组件）。
​可复用组件实现通用的功能（不会因组件使用的位置、场景而变化）：
（1）UI 的展示
（2）与用户的交互（事件）
（3）动画效果
​业务组件实现偏业务化的功能：
（1）获取数据
（2）和 vuex 相关的操作
（3）埋点
（4）引用可复用组件
​可复用组件应尽量减少对外部条件的依赖，所有与 vuex 相关的操作都不应在可复用组件中出现。
​组件应当避免对其父组件的依赖，不要通过 this.children 来引用子组件的示例，而是通过子组件的接口与之交互。