如何在 VueJS 中的组件之间共享数据 [英] How to share data between components in VueJS

问题描述

我有一个相当简单的 VueJS 应用程序，包含 3 个组件(登录、SelectSomething、DoStuff)

I have a fairly simple VueJS app, 3 components (Login, SelectSomething, DoStuff)

登录组件只是一个供用户和传递输入的表单，而第二个组件需要显示在登录过程中获得的一些数据.

Login component is just a form for user and pass input while the second component needs to display some data obtained in the login progress.

如何将数据从一个组件共享到其他组件?这样当我路由到第二个组件时，我仍然拥有登录一个中获得的数据?

How can I share data from one component to the others? So that when I route to second component I still have the data obtained in the Login one?

推荐答案

你可以使用 props 或事件总线，您可以在其中从组件发出事件并侦听另一个

You can either use props or an event bus, where you'll be able to emit an event from a component and listen on another

vm.$on('test', function (msg) {
  console.log(msg)
})

vm.$emit('test', 'hi')
// -> "hi"

这篇关于如何在 VueJS 中的组件之间共享数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！