vuex 이름에서 mapState가 여러 모듈로 증가함

vuex 이름에서 mapState가 여러 모듈로 증가함

내가 뭔가 놓친 게 틀림없어.vuex mapState를 여러 모듈과 함께 사용하려면 어떻게 해야 합니까?

namesched mapState는 객체를 인수로 전달하는 것 외에 네임스페이스와 모듈의 멤버를 나타내는 객체 이름의 배열이라는 두 가지 인수를 사용할 수 있습니다.이것처럼.

// an imcomplete vue
export default {
   computed: mapState('user', ['addresses', 'creditCards']) 
};

그러나 두 번째 네임스페이스의 개체를 계산에 추가하려면 어떻게 해야 합니까? 예를 들어 다음과 같은 벤더:

mapState('vendor', ['products', 'ratings']) 

현재 두 mapState를 다음과 같이 Marge하고 있습니다.

let userMapState = mapState('user', ['addresses', 'creditCards']); 
let vendorMapState = mapState ('vendor', ['products', 'ratings']);
let mergedMapStates = Object.assign({}, userMapState, vendorMapState);

그 후:

// an imcomplete vue
export default {
    computed: mergedMapStates
};

효과는 있지만, 올바른 방법은 아닙니다.아니면 그러한가?

산포 연산자 사용:

computed: {
  ...mapState('user', ['addresses', 'creditCards']),
  ...mapState('vendor', ['products', 'ratings']) 
}

이것은 vuex 문서에서 가져온 것으로, 1개의 문서 내에서 모든 작업을 수행할 수 있습니다....mapState({}). 문서

computed: {
  ...mapState({
    a: state => state.some.nested.module.a,
    b: state => state.some.nested.module.b
  })
},

2019년 편집

네스트된 모듈에 경로를 전달하여 모듈 참조를 보다 깔끔하게 만들 수도 있습니다(@gijswijs 고마워).

computed: {
  ...mapState('some/nested/module', {
    a: state => state.a,
    b: state => state.b
  })
},

네임스페이스가 너무 많지 않은 경우 다음을 시도할 수 있습니다.

    ...mapState({
      userAddresses: 'user/addresses',
      userCreditCards: 'user/creditCards'

      vendorProducts: 'vendor/products',
      vendorRatings: 'vendor/ratings',          
    }) 

Object.assign을 다음과 같이 사용할 수도 있습니다.현재 솔루션과 비슷하지만 좀 더 깔끔합니다.

    computed: Object.assign(
        mapState('user', ['addresses', 'creditCards']),
        mapState('vendor', ['products', 'ratings']
    )

확산 연산자를 사용하여 여러 모듈 상태 값에 액세스합니다.

 ...mapState('user', {
     isLoggedIn: ({ activeUser }) => !!activeUser?.id
  }),
   ...mapState('quizzes', ['getCategories'])

언급URL : https://stackoverflow.com/questions/45594244/vuex-namespaced-mapstate-with-multiple-modules