3.1 vue组件的使用

组件： 组件是一个局部功能界面，它包含了所有要实现这个功能界面的相关资源，如css、html等.

组件化编程：

vue文件包含3个部分
    <template>
      <div></div>
    </template>
    <script>
        export default {
          props: []/{}
          data(){},
          computed: {}
          methods: {},
          
          watch: {}
          filters: {}
          directives: {}
          components: {}
        }
    </script>
    <style>
    </style>
组件化编码的基本流程
    1). 拆分界面, 抽取组件
    2). 编写静态组件
    3). 编写动态组件
        初始化数据, 动态显示初始化界面
        实现与用户交互功能
组件通信的5种方式
    props
    vue的自定义事件
    pubsub第三方库
    slot
    vuex(后面单独讲)
props:
    父子组件间通信的基本方式
    属性值的2大类型: 
        一般: 父组件-->子组件
        函数: 子组件-->父组件
    隔层组件间传递: 必须逐层传递(麻烦)
    兄弟组件间: 必须借助父组件(麻烦)
vue自定义事件
    子组件与父组件的通信方式
    用来取代function props
    不适合隔层组件和兄弟组件间的通信
pubsub第三方库(消息订阅与发布)
    适合于任何关系的组件间通信
slot
    通信是带数据的标签
    注意: 标签是在父组件中解析
vuex
    多组件共享状态(数据的管理)
    组件间的关系也没有限制
    功能比pubsub强大, 更适用于vue项目