Vue.js，将数据传递给另一条路线上的组件

Question

将数据从一个页面传递到另一个页面的简单任务让Vue.js中的新手感到非常头疼 这是我的路由器

我在＆＃34; /＆＃34;上呈现表单页面，它发出API请求，

我只想将数据传递到另一个组件的路由页面

在Vue这么难吗？今天对我来说真的很头疼。 从API获取数据，另存为＆amp;发送到另一个组件。我该怎么办？

Answer 1

正如Antony所说，既然你已经在router/index.js启用了道具，你可以像router.push一样传递参数：

router.push({
    name: 'events',
    params: {
        items: data
    }
});

然后您就可以在items

中收到EventsDisplay.vue作为道具

export default {
    name: 'eventsDisplay',
    props: ['items'],
};

Answer 2

如果要全局保存，可以使用事件总线或VueX存储来包含它，然后在需要访问它时从此事件总线或存储中保存并加载它。

如果您只想在这两个组件之间传递它，并且仅在从第一个组件访问第二个页面时，您可以按照本指南将属性传递给路由参数：https://router.vuejs.org/en/essentials/passing-props.html

Answer 3

尝试使用 Vuex

在源组件中

this.$store.commit('changeDataState', this.$data);
this.$router.push({name: 'user-post-create'});

在目标组件中

created () {
    console.log('state', this.$store);
    this.$store.getters.Data;
}