Разделение магазина на отдельные файлы (действия, мутации, геттеры) теперь не работает с API-вызовами - PullRequest
Новая
       28

Разделение магазина на отдельные файлы (действия, мутации, геттеры) теперь не работает с API-вызовами

0 голосов
/ 27 сентября 2019

Сначала я пытаюсь разложить мой магазин, чтобы все геттеры, действия и мутации находились в отдельных файлах в соответствии с этим ответом: https://stackoverflow.com/a/50306081/5434053

У меня есть вызовы API в файле служб, POSTвызовы API, кажется, работают, но вызовы GET - нет, действие, похоже, ничего не возвращает.Я что-то пропустил? 


import Vue from 'vue';
import Vuex from 'vuex';

import actions from './actions';
import getters from './getters';
import mutations from './mutations';

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    status: '',
    token: localStorage.getItem('token') || '',
    user: {},
    movie: {},
    movies: {}
  },
  actions,
  getters,
  mutations,
});

store / actions.js 

import axios from 'axios'
import {APIService} from '../services/APIService';
const apiService = new APIService();

let getMovies = async ({commit, state, getter}) => {
    try {
      await apiService.getMovies(localStorage.getItem('token')).then((data, error) => {
        for (const movie of data.data.data.movies) {
          movie.edit = false;
          movie.deleted = false;
        }
        this.movies = data.data.data.movies;
        console.log(data)
        commit("fetch_movies", this.movies);        
      })
    } catch(error) {
      commit('auth_error')
      localStorage.removeItem('token')
      console.log(error)
    }
}

export default {
  getMovies,
};

1 Ответ

0 голосов
/ 27 сентября 2019

Похоже, вы импортируете actions из ./actions.Однако, когда я смотрю на ваш файл на store/actions.js, вы ничего не экспортируете.

Для работы модулей JavaScript вы должны добавить операторы export в свои файлы - чтобы вы могли импортировать экспортированные переменные / свойствагде-то еще.

Кроме того: Вы, кажется, объявляете функцию getMovies() только без добавления ее к объекту actions (который вы импортируете в store.js).

Попробуйте это: 

// in store/actions.js

// your code..

const actions = {
  getMovies,
}

export default actions;

Редактировать:

Только что заметил, что вы также используете this в своих действиях.Если я не ошибаюсь, он должен быть неопределенным, поскольку вы работаете только с лямбдами (функции стрелок).

...