Vue.js Vue-为什么可以'；我是否在vuex中显示axios get请求的结果？

我与Laravel、vue、vuex和axios合作

我正试图从数据库中获取数据并显示在我的组件中

这是我的

列表.vue

文件

    <specialist v-for="doctor in DoctorsPerDayData" :key="doctor.id">

        <template slot="speciality">
            <a class=" button specialist" @click="clicked(doctor)">
                <strong>
                    {{ doctor.speciality}}
                </strong>
            </a>
        </template>
        <template slot="doctor">{{ doctor.name}}</template>

    </specialist>

export const store = new Vuex.Store({
state:{
    DoctorsPerDay: null,
},
getters:{
    DoctorsPerDayData: state => {
        return state.DoctorsPerDay
    }
},
mutations:{
    UpdateDoctorsPerDay(state , DoctorsPerDay ){
        state.DoctorsPerDay = DoctorsPerDay;
    }
},
actions:{
    UpdateDoctorsPerDay: ({commit})=>{
        axios.get('/get/Doctors/date')
            .then((response) => {
                commit('UpdateDoctorsPerDay', response.data)
            })
    },
}
});

这是我的

store.js

文件

    <specialist v-for="doctor in DoctorsPerDayData" :key="doctor.id">

        <template slot="speciality">
            <a class=" button specialist" @click="clicked(doctor)">
                <strong>
                    {{ doctor.speciality}}
                </strong>
            </a>
        </template>
        <template slot="doctor">{{ doctor.name}}</template>

    </specialist>

export const store = new Vuex.Store({
state:{
    DoctorsPerDay: null,
},
getters:{
    DoctorsPerDayData: state => {
        return state.DoctorsPerDay
    }
},
mutations:{
    UpdateDoctorsPerDay(state , DoctorsPerDay ){
        state.DoctorsPerDay = DoctorsPerDay;
    }
},
actions:{
    UpdateDoctorsPerDay: ({commit})=>{
        axios.get('/get/Doctors/date')
            .then((response) => {
                commit('UpdateDoctorsPerDay', response.data)
            })
    },
}
});

另一方面，我的vuex开发工具显示每日医生有数据

---

我没有得到任何错误：|

假设您在

computed

键中编写了这段代码

1 //    ...mapGetters([
2 //        'DoctorsPerDayData'
3 //     ]),
4 //    DoctorsPerDayData (){
5 //        return this.$store.state.DoctorsPerDay
6 //    }
7       DoctorsPerDayData : {
8           get(){
9               return this.$store.state.DoctorsPerDay
10          }
11      }

可能解1 对于行

1-3

中的块，我以前使用了

mapGetters

作为一种方法，将上面的camel大小写转换为camel大小写，如下所示

...mapGetters({
    doctorsPerDayData: 'DoctorsPerDayData'
}),

在此之后，您可以在

…html

中使用

doctorsPerDayData

，就像这样

可能解2

---

然后我会说在块行

7-11

中，应该

返回这个.store.getters.DoctorsPerDay

注意

getters

的区别，而不是

state

为了测试，请创建一个新的laravel项目，并使用vue和vuex执行specefic示例，我看到了它的效果

因此，我只需制作一个新的laravel项目，并将我的文件一步一步地精确地移动到其中

它的工作非常完美：|）

对不起，我的英语不够好；）

---

祝你好运…

测试了两种解决方案，结果相同：（你能分享一下你的

专家.vue

的样子吗？