Используйте getter в том же модуле, в котором он был создан

Question

Можно ли инициализировать state's property, используя getter, созданный в том же модуле? Примерно так:

export const gamesModule = {
state: {
    games: [],
    selectedGameID: null,
    playerOnTurnID: this.getters.getSelectedGame.playerData[0]
},
getters: {
    getGames: state => state.games,
    getselectedGameID: state => state.selectedGameID,
    getSelectedGame: state => getSelectedGameById(state.games, state.selectedGameID),
},
mutations: {
  SET_GAMES (state, game) {
    state.games.push(game);
  },
  SET_SELECTED_GAME_ID (state, id) {
    state.selectedGameID = id;
  },
  SET_PLAYER_ON_TURN_ID (state, playerID) {
    state.playerOnTurnID = playerID;
  }
},
actions: {
  async createGame({ commit }) {
    try {
      const { data } = await gameService.createGame();
      commit('SET_GAMES', data);
    } catch (error) {
      console.warn('Error creating new game: ', error);
    }
  },
  setSelectedGameID({ commit }, id) {
    commit('SET_SELECTED_GAME_ID', id);
  },
};

Написано так, оно не работает, потому что getters не определено.

Answer 1

this не существует в контексте объекта и действительно применим только в функциях или классах конструктора.

Здесь я вижу две проблемы.

Прежде всего, вы можете ' Ссылка на сам объект, потому что он еще не был определен. Вам нужно будет создать локальную переменную, прежде чем объявлять объект, который будет иметь общее свойство, в данном случае функцию getter.

Во-вторых, что более важно, я не уверен, что это поможет получить доступ функция getter (Reducer), поскольку она не знает о состоянии, которое передается ей как первый параметр базовой библиотекой Vuex при обработке мутаций (Actions).

Vuex основан на шаблоне Redux , Action -> Reducer -> Store, я бы посоветовал прочитать краткое введение о том, как работает Redux, так как это поможет вам лучше понять поток действий внутри Vuex.