本文详细介绍了Vue中组件间的通信方式，包括父组件如何通过props将数据传递给子组件，子组件如何通过$emit向父组件发送事件传递数据，以及如何利用事件总线实现兄弟组件间的通信。通过这些机制，开发者能够灵活地在Vue应用中管理组件间的数据流动。
父传子
首先在使用子组件的标签上 通过自定义属性传递变量 在子组件中 通过 props 接受
在接收的时候有两种接收方式 数组形式 和 对象形式 对象形式可以规定传来的变量的数据类型（type）默认值（default）以及是否必填（required）
子传父
首先在使用子组件的标签上定义一个自定义事件 在子组件里通过 this.$emit 去调用这个自定义事件 $emit 方法的第一个参数是自定义事件的名字 第二个参数是就是子组件要传递给父组件的变量 最后在父组件接收使用就可以了
兄弟传值
利用中央事件总线 eventbus
在 main.js 中 把一个空的 vue 实例挂载在 vue 的原型上起名叫 b u s 传 数 据 的 时 候 用 t h i s . bus 传数据的时候用this. bus传数据的时候用this.bus. e m i t 传 在 要 接 受 数 据 的 子 组 件 在 c r e a t e d 钩 子 函 数 中 用 emit传 在要接受数据的子组件 在 created钩子函数中 用 emit传在要接受数据的子组件在created钩子函数中用on 方法接收
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
