技术点总结
组件设计的思想包括单数据流/ eventBus事件中心，核心是组件通信。
单数据流: 数据的改变是单向的，即通过props的方式，只能让父组件来修改数据，子组件不能主动修改props。这样的例子如在collapse/tab/slide组件中，让父组件来控制选中的值。单向数据流的思想让数据修改更好设计，逻辑更加清晰。
vue插件开发：什么时候用插件开发?当组件不是显式在代码中被调用，不是直接写在template中，而是通过调用Vue原型链上的方法被挂载到文档中。
比如modal模态框/toast弹窗。插件设计的基本思路是暴露一个install方法，这个方法中在vue原型链上增加一个自定义的方法X， X中引入组件a，通过Vue.extend(a)获得组件构造器Constructor, 在通过new Constructor({propsData})获得组件实例vm, 再挂载组件实例到文档中。
import modal from '../notice/modal'export default {
install (vue, options) {
const Construtor = vue.extend(modal)
let modalVm // 保证全局只有一个modal实例
let lastOption
vue.prototype.$modal = (options) => {
if (lastOption !== JSON.stringify(options)) { //! modalVm
modalVm = new Construtor({ propsData: options })
modalVm.$mount()
document.body.append(modalVm.$el)
}
lastOption = JSON.stringify(options)
modalVm.isVisible = true
}
}
}
eventBus：什么时候用eventBus?当状态的变化需要多个子组件被通知。如tab组件中，当选中的值发生变化，tab-head需要感知变化让提示的短线做个动画滑到选中的标签下，tab-item需要感知变化让文字变成选中样式，tab-pane需要感知变化让选中的面板出现。
递归：在级联组件的设计中用到。类似函数fn中用setTimout(fn,millseconds)调用自己实现setInterval的递归效果。组件只要内部提供name属性，就可以递归地调用自身。允许组件模板递归地调用自身。通过提供 name 选项，便于调试，在控制台可以看到可以获得更有语义信息的组件标签。
媒体查询 &flex布局：响应式布局的原理是媒体查询和百分比布局，介于某个尺寸的时候某个类名生效;跟布局相关的大部分用到flex,非常好用。详细看阮一峰老师教程
