Question

这是我的store.js

const state = {
id: null,
trainingTypeName: null,
trainingTypes: [],
trainingType: null

};

我的突变

const mutations = {

'GET_TRAINING_TYPES' (state,trainingtypes){
    state.trainingTypes = trainingtypes
},
storeTraining(state,trainingType){
    state.trainingType = trainingType
}

};

我的动作

const actions = {
getTrainingTypes({ commit }){
    axios.get('/select')
        .then(response => {

            const data = response.data
            const trainingTypes = []
            for(let key in data){
                const trainingType = data[key]
                trainingType.id = key
                trainingTypes.push(trainingType)

            }

            commit('storeTraining',trainingTypes[0])

        })
        .catch(error => console.log(error))
}
};

我的吸气剂

const getters = {
trainings(state){
    return state.trainingType
}
};

下面的图片是我在api上得到的。 my api return

在我的组件中

<template>      
      <p>Training Type Name: {{ training }}</p>
</template>

<script>

    import axios from 'axios'

    export default {
        created(){
            this.$store.dispatch('getTrainingTypes')
        },
        computed: {
            training(){
                return this.$store.getters.trainings.trainingTypeName
            }
        }
    }

</script>

我收到一个错误“ TypeError：this。$ store.getters.trainings为空”，尽管它有数据。有人告诉我我的错误在哪里吗？

Vuex getter返回null

0 个答案: