Question

之所以写这里，是因为我刚刚获得一份前端开发人员的工作，而第一天他们就把一个大项目扔给我，而我却迷失了，非常迷失，无望。

我的工作是在主页上有一个表，其中包含一些信息，例如日期，小时，每日风速，每日摄氏，而在该表下将有一些信息，这些信息可以从配置面板。所以基本上在Vue-router中有两个页面，一个带有主页，一个带有配置面板，现在在配置面板中，我有一个表单，可以在其中编写要显示到首页的文本，而我的问题是我不知道如何显示从一个路由器到另一个路由器的文本，我试图建立一种方法，在提交表单时应该以某种方式将该消息提交到我的Vuex状态，但是当我要将其写到首页时，正在显示，

这就是我模块（vuex文件）中的内容：

const state = {
    message: '',

};
const getters = {
    message: (state) => {
        return state.message;
    },

};

const actions = {
    setMessage: ({
        commit,
        state
    }, newValue) => {
        commit('SET_MESSAGE', newValue);
        return state.message;
    },

};
const mutations = {
    SET_MESSAGE: (state, newValue) => {
        state.message = newValue;
        console.log(state.message);
    },

};

export default {
    state,
    getters,
    actions,
    mutations,
};

当我在控制台上记录状态时，现在需要将提交的文本放在主页上，请帮助我，我知道这应该很简单，但是我无法解决。

Answer 1

您应该在首页上添加

created() {
    this.$store.dispatch('SET_MESSAGE');
}

此代码将调用SET_MESSAGE

computed: {
    ...mapGetters({
        message: 'message',
    }),
}

添加此部分后，您可以在方法中简单调用消息值“ this.message”或在模板中简单调用“ message”

Vuex问题，重要项目，MapActions，MapGetters

1 个答案: