Vuex 状态未更新

Question

我正在尝试根据用户是否是零售商来呈现不同的 UI。我想我几乎一切都正确，但是当应用程序初始化时，我想检查用户是否是零售商（这会调度 checkAuth 操作）。

我尝试运行以下命令从 Firebase 获取 isRetailer 属性的值。

firebase.database().ref('/users/' + user.uid + '/isRetailer').once('value').then(snapshot => snapshot.val()

然后我根据结果调度一些操作。出于某种原因，即使用户 isRetailer 属性为 true，我的 Vuex 状态的 isRetailer 部分也不会从 false 更新。

我不太确定为什么，但我猜这与我的 firebase 参考有关。我的完整代码如下。谢谢！

import firebase from 'firebase'

const authentication = {
    state: {
        isAuthed: false,
        authId: '',
        isRetailer: false
    },
    mutations: {
        authUser (state, user) {
            state.isAuthed = true;
            state.authId = user.uid;
        },
        notAuthed (state) {
            state.isAuthed = false;
            state.authId = '';
            state.isRetailer = false
        },
        isRetailer (state) {
            state.isRetailer = true
        },
        isNotRetailer (state) {
            state.isRetailer = false
        }
    },
    actions: {
        checkUser (context, user) {

            if (!user.uid) {

                // Do nothing.

            } else if (firebase.database().ref('/users/' + user.uid + '/isRetailer').once('value').then(snapshot => snapshot.val()) === true) {

                context.commit('authUser', user);

                context.commit('isRetailer');

            } else {

                context.commit('authUser', user);

                context.commit('isNotRetailer');
            };
        },
        signOut (context) {
            context.commit('notAuthed')
        },
        setRetailer (context, payload) {

            // Set retailer info in Firebase.

            var uid = payload.user.uid;
            firebase.database().ref('/users/' + uid).set({
                name: payload.name,
                email: payload.email,
                location: payload.retailerLocation,
                isRetailer: payload.isRetailer
            });  

        },
        setNewUser (context, payload) {

            // Sets a user in firebase w/ a isRetailer value of false. 

            var uid = payload.user.uid;

            firebase.database().ref('/users/' + uid).set({
                name: payload.name,
                email: payload.email,
                isRetailer: payload.isRetailer
            });
        }
    },
    getters: {}
};

export default authentication;

Answer 1

这可能是因为您为突变和状态变量指定了相同的名称：isRetailer，我现在没有任何参考，但这可能是突变未触发的情况，您可以通过设置尝试一次您的变异名称不同，例如：

mutations: {
    ...
    ...
    setIsRetailer (state) {
        state.isRetailer = true
    },
    isNotRetailer (state) {
        state.isRetailer = false
    }
},

并在行动中使用它：

actions: {
    checkUser (context, user) {
        ...
        ...

            context.commit('authUser', user);
            context.commit('setIsRetailer');

        }