Почему Vuex State возвращает массив как объект

Question

Я использую Typescript + vue + vuex, состояние определяется как

const state: CommonDataState = {
  clients: [],
  version: 1
}

Получатели:

const getters: GetterTree<CommonDataState, RootState> = {
  getClients: state=> () => { return state.clients; },
  getClientById: state => (id: string) => { return state.clients.filter(x => true)[0]; },
  getVersion: state => (): Number => { return state.version; }
}

При вызове метода getClientById,

Ошибка при рендеринге: «TypeError: state.clients.filter не является функцией»

Когда я печатаю state.clients с console.log (), он показывает, что результатом является объектсо свойством по умолчанию в качестве массива вместо типа Array

{__esModule: true, __ob__: Observer}
default : Array(15)
__esModule : true
__ob__ : Observer {value: {…}, dep: Dep, vmCount: 0}
get default : ƒ reactiveGetter()
set default : ƒ reactiveSetter(newVal)
__proto__ : Object

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

  getClientById: state => (id: string) => { return state.clients.default.filter(x => true)[0]; },

, он возвращает ошибку

[ts] Свойство 'default' не существует для типа 'Client []'.

Итак, кто-нибудь знает, что вызвало эту ошибку?и какое решение для этого?

Answer 1

try Изменить на эту структуру

import { GetterTree, Getter } from 'vuex'
import { State } from './index'

const cartProducts: Getter<State, any> = (state: State) => {
  return state.cart.added.map(shape => {
    // ...
  })
}

const getterTree: GetterTree<State, any> = {
  cartProducts
}

export default getterTree