Почему я должен распространять геттер Vuex из одного модуля, а не один из другого модуля?

Question

У меня есть магазин VueX с двумя модулями, user.js и merchant.js, верхний уровень - index.js.

Получатель в user.js:

Refactor

  const getters = {
  selectedShippingAddress (state) {
    return state
      .shippingAddresses.find(({ shippingAddressId }) => shippingAddressId 
      === state.selectedShippingAddressId)
     }
    }  

Старая версия

   selectedShippingAddress (state) {
    return state
      .shippingAddresses
      .filter(({ shippingAddressId }) => shippingAddressId === state.selectedShippingAddressId)
      .pop()
  }

Получатель в merchant.js:

    merchantAllowedShippingCountries (state) {
      if (state.shippingLocationProfiles) {
        return state.shippingLocationProfiles.split(',')
       } else {
         return []
        }
      }
     }

И, наконец, index.js:

   isCountrySupportedByMerchant (state, getters) {

    **// the const userShippingAddress fails **
    const userShippingAddress = getters.selectedShippingAddress

    **// this works with spreading **
    const userShippingAddress = { ...getters.selectedShippingAddress }
    const countriesMerchantShipsTo = getters.countriesAllowedForShipping
    for (const country in countriesMerchantShipsTo) {
      if (userShippingAddress.countryCode === country) {
        return true
      }
    }
    return false
  }

Я задаю этот вопрос, потому что приложение не работает, а также интеграционный тесткогда не используется оператор распространения.

Обе версии user.js, рефакторинг, использующий find, и старая, использующая pop (), возвращают undefined, если массив пуст.Я подозреваю, что это связано с тем, что find () использует обратный вызов, а pop () нет.Или это касается доступа к свойству, потому что мне нужно получить countryCode в цикле?

Почему это работает, только когда я распространяю геттер из user.js?

Answer 1

const userShippingAddress = getters.selectedShippingAddress

когда массив пуст, то userShippingAddress будет undefined, поэтому userShippingAddress.countryCode приведет к ошибке.

Однако, когда вы распространяете геттер из user.js, { ...getters.selectedShippingAddress } будет Объектом, как этот {}, поэтому userShippingAddress.countryCode будет работать нормально.