vue 父子组件和兄弟组件之间的数据传递问题

发布于 2022-09-05 23:12:37 字数 503 浏览 14 评论 0

图片描述

我们知道可用props从父组件向子组件传递数据
也可用在父组件上绑定一个自定义事件,然后在子组件内emit触发事件,到达从子组件向父组件传递数据的目的。

但是如果我们要实现简单的兄弟组件间的通信,比如途中组件1和组件2的通信。图片描述

实际中是这样

组件1选择好地址后 会在地图上maker一个点, 然后计算出路程事件和距离显示在组件一中。

如果数据传递是通过 先传给父组件再从父组件下发给子组件是不是稍显麻烦。
有什么好的思路请指教

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

瞳孔里扚悲伤 2022-09-12 23:12:38

项目组件间交互比较复杂建议引入vuex,不是特别复杂就可以共用同一个vue对象,用$emit和$on操作

海的爱人是光 2022-09-12 23:12:37

你可以用bus来解决。

var bus = new Vue()
// 触发组件 A 中的事件
bus.$emit('id-selected', 1)
// 在组件 B 创建的钩子中监听事件
bus.$on('id-selected', function (id) {
  // ...
})

官方文档 - 非父子组件通信

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文