vue组件通信

1.`⽗传⼦` 在⼦组件的标签上定义属性 ⼦组件通过props来进⾏接受,可以通过数组的⽅式进⾏接 受,也可以通过对象的⽅式来进⾏接收,如果⽗组件没有传递属性,⼦组件可以default来设置默认值

2.`⼦传⽗` ⼦组件通过this.$emit("⾃定义的事件",要传给⽗组件的数据), ⽗组件通过⼦组件 的标签监听⾃定义的事件,通过⽅法来接收传递的数据

3.`⾮⽗⼦组件通信` 通过中央事件总线,我们也称之为eventBus, 我们需要创建⼀个空的js⽂件,导出这个空的vue实例传数据的时候 this.$bus.$emit 传 接数据的时候是在 钩⼦函数 created 中 this.$bus.$on 接收 第⼀个参数是事件名称 第⼆ 个参数是⼀个回调函数 包含了要接受的数据,以上就是⾮⽗⼦组件通信的⽅式

4.利⽤ `vuex` 进⾏组件通信 把公共的数据存在 vuex ⾥就可以实现组件之间都能使⽤这个数据 了

5.其实` v-model` 也能实现组件通信 因为 v-model 就是 :value 和 @input 事件的合写 如果在⼀个⼦组件上使⽤ v-model 也能实现⽗⼦组件之间的通信

6.⽤`本地存储 `来 完成组件通信

7.通过`ref和refs`实现组件之间的通信

8.`.sync` 修饰符

9.`$parent和$children` 在⼦组件内可以直接通过$parent对⽗组件进⾏操作，在⽗组件内可以直接通过$children 对⼦组 件进⾏操作 在⽗组件调⽤⼦组件时候要加下标也就是$children 是⼀个数组 因为可以有很多个⼦组件

10.`provide 和 inject` ⽗组件通过通过 provide 提供变量 ⼦组件中通过 inject 注⼊变量，不论嵌套了⼏层⼦组件 都 能通过 inject 来调⽤ provide 的数据

11.`$attr+$listener` 如果⽗组件A 下⾯有⼦组件 B ⼦组件 B 下⾯⼜有⼦组件 C 如果 a 组件的变量和⽅法想要传给 组件 C 的时候 就⽤到这个⽅法 适⽤于多级组件传值 在 B 组件中给 C 组件绑定 v-bind="$attrs" v-on="$listeners" 然后在 C 组件中就可以 直接使⽤ a 传来的属性和⽅法了（简单来说：$attrs与$listeners 是两个对象，$attrs ⾥存 放的是⽗组件中绑定的⾮ Props 属性，$listeners ⾥存放的是⽗组件中绑定的⾮原⽣事件。）

组件通信⽬的：传递或共享某些数据，解决组件间数据⽆法共享的问题

props选项作⽤：设置和获取标签上的属性值的

vue组件化理解：

1.组件是独⽴和可复⽤的代码组织单元。组件系统是Vue核⼼特性之⼀，它使开发者使⽤⼩型、独⽴ 和通常可复⽤的组件构建⼤型应⽤；

2.组件化开发能⼤幅`提⾼应⽤开发效率、测试性、复⽤性`等；

3.组件使⽤按分类有：⻚⾯组件、业务组件、通⽤组件；

4.vue的组件是基于配置的，我们通常编写的组件是组件配置⽽⾮组件，框架后续会⽣成其构造函 数，它们基于VueComponent，扩展于Vue；

5.vue中常⻅组件化技术有：属性prop，⾃定义事件，插槽等，它们主要⽤于组件通信、扩展等；

6.合理的划分组件，有助于提升应⽤性能；

7.组件应该是⾼内聚、低耦合的；

8.遵循单向数据流的原则。