Vuex Laravel 加载所有数据

Question

我在登录时一直在尝试加载所有数据。目前，我只能通过 vuex 文件通过控制台显示数据。我只是想实现这一点，因为它在登录时加载所有数据的地方，我更容易调用每个页面上的每个函数。

我认为第一步是在vue devtools上显示？

这是我尝试过的。 我的“./store/modules/currentUser.js”上有这个文件

import axios from "axios";
const state = {
};
const getters = {};
const actions = {
    loadEmployee({}){
        axios.post(BASE_URL + '/transportation/driver/autoComplete').then(response => {
            console.log(response.data); // how to pass result to devtools?
        });
    }
};
const mutations = {};

export default {
    namespaced: true,
    state,
    getters,
    actions,
    mutations

}

Login.vue

<script>
export default {
    data () {
        return {
            listdata:[]
        }
    },
    methods: {
        login() {
            this.$store.dispatch('currentUser/loadEmployee', this.listdata);
        }
    }
}
</script>

这是我的 vuedevtools 的样子

我想获取 listdata 数组 vue devtools 上的所有数据

Answer 1

如果您使用的是 vuex，您可能应该在开发工具中加载状态。

但是，您的问题是由于没有突变引起的，因此您永远不会更新状态。

import axios from "axios";
const state = {
    transansportDrivers: [] 
};
const getters = {};
const actions = {
    loadEmployee({}){
        axios.post(BASE_URL + '/transportation/driver/autoComplete').then(response => {
            commit('setTransportDrivers', response.data)
        });
    }
};
const mutations = {
    setTransportDrivers: (state, drivers) => {
        state.transansportDrivers= drivers;
    },
};

export default {
    namespaced: true,
    state,
    getters,
    actions,
    mutations
}