│ ├─container
│ ├─datepicker
│ ├─form
│ ├─icon
│ ├─layout
│ ├─notice
│ ├─plugins
│ ├─slide
│ ├─tab
│ ├─step
│ ├─sticky
│ └─index.js // 组件库源码组件入口文件,执行npm run build的目标文件
├─package.json // 与npm发布相关，记录版本号，包入口文件地址
学习组件库制作会收获
学习组件封装技能，良好的接口设计, 掌握组件设计套路
夯实js/css基础
深入对vue的理解
制作流程
组件设计/开发
发布npm
制作官网展示
组件设计/开发
频繁涉及到的vue api包括
$children ： 获取当前组件子组件。
$parent： 获取当前组件父组件。
$options: 用于当前 Vue 实例的初始化选项, 可以用此选项获得组件的name。
$refs： 一个对象，持有注册过 ref 特性 的所有 DOM 元素和组件实例。
$el: Vue 实例使用的根 DOM 元素。
provide & inject ：这对选项需要一起使用，允许一个祖先组件向其所有子孙后代注入一个依赖,注意不是响应式的。注入的对象可以是个vue实例的eventBus。
$on： 组件监听自定义事件。
$emit： 组件触发自定义事件。
.sync：语法糖，单向数据流中，父组件监听到子组件修改props的意图后父组件修改传入的props，用了.sync不需要显式在父组件监听组件内部触发的自定义事件去修改值, 父组件只要写:x.sync=”bindValue”, 注意此时子组件触发的事件必须是”update:x”此语法糖才生效。
updated 生命周期钩子函数，由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子, 在父子组件通信可能用到。
beforeDestoryed/ destory 生命周期钩子函数，destory后组件的所有的事件监听器会被移除。注意:如果是自己在组件内部对dom增加了事件监听，组件销毁的时候需要自己手动接触自己另外添加上去的监听程序。而且组件销毁，dom元素还被保留在页面，需要手动清除，可以调用原生js api, node.remove()清除dom节点。
原生js api包括：
target.addEventListener(type, listener[, useCapture])/removeEventListener 由于这是 DOM2 规范的基本内容，几乎所有浏览器都支持这个，而且不需要特殊的跨浏览器兼容代码。
Node.contains()返回的是一个布尔值，来表示传入的节点是否为该节点的后代节点。多用于事件监听判断是否点击了目标区域。
window.scrollY 获取文档垂直方向的滚动距离。
Element.getBoundingClientRect() 返回元素的大小及其相对于视口的位置，返回一个对象，包括width/height/left/right/top/bottom。多用于计算定位。
