Vuex getter возвращается null - PullRequest
0 голосов
/ 10 июля 2019

Вот мой 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. мой API возвращают

И в моем компоненте

<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>

я получаю сообщение об ошибке «Ошибка типа: this. $ Store.getters.trainings is null», хотяесть данные.Любой совет, где моя ошибка здесь?

...