Как обновить состояние Vuex? (Стек MEVN)

#node.js #vue.js #axios #vuex

#node.js #vue.js #аксиос #vuex

Вопрос:

Я занимаюсь школьным проектом, и в настоящее время я просто пробую Vuex, я хочу получить список семинаров от Vuex, но, похоже, я не могу обновить свое состояние.

Это мой серверный сервер узла:

 router.get('/all', (req, res) =gt; {  Workshop.find({})  .then( workshop =gt; {  return res.status(201).json({  workshop: workshop,  success: true  })  })  .catch( err =gt; {  console.log(err)  }) })  

Это мой результат в «Почтальоне»: введите описание изображения здесь

Это мой магазин Vuex:

 import axios from 'axios'  const state = {  workshop: {} }  const getters = {  workshop: state =gt; state.workshop }  const actions = {  async getWorkshop({ commit }) {  let res = await axios.get('http://localhost:5000/api/workshops/all');  commit('workshop_success', res.data.workshop);  return res.data.workshop;  } };  const mutations = {  workshop_success(state, workshop) {  state.workshop = workshop  } };  export default {  state,  getters,  actions,  mutations }  

Это мой компонент:

 lt;templategt;  lt;pgt;{{ workshop }}lt;/pgt; lt;/templategt;  lt;scriptgt; import { mapGetters, mapActions } from 'vuex'  export default {  computed: {  ...mapGetters(['workshop'])  },  methods: {  ...mapActions(['getWorkshop'])  },  created() {  this.getWorkshop  }, } lt;/scriptgt;  

Проблема в том, что я могу получить состояние мастерской через Vuex, оно отображает простой пустой объект «{}» (который является начальным состоянием), но, похоже, я не могу запустить действие с помощью созданного крючка, и состояние не меняется. Если у кого-нибудь есть представление о том, что я сделал не так, это было бы действительно полезно, потому что сейчас я действительно потерян. Заранее благодарю вас!

Ответ №1:

state является не состоянием, а объектом контекста в параметрах мутации и т. Д. В противном commit случае доступ к etc был бы невозможен.

Это:

 workshop_success({ state }, workshop) {  state.workshop = workshop }  

Также это не-оп:

 created() {  this.getWorkshop },  

Функцию следует вызывать как this.getWorkshop() .