namesed 이외의 모듈에서의 mapState

namesed 이외의 모듈에서의 mapState

모듈이 있습니다.

export default {
  namespaced: false,
  state,
  actions,
  mutations,
  getters
};

내 컴포넌트에서 다음과 같은 작업을 수행했습니다.

 ...mapState(["user"]),
 ...mapState('auth',["user"]),

둘 다 작동하지 않습니다.대신 이것을 계산 속성으로 사용해야 합니다.

user() { return this.$store.state.auth.user; },

mapState를 사용할 수 있습니까?

맵게터

nameshorized 모듈에서는 getter를 정의하는 것이 가장 효율적입니다.장점은 속성을 사용할 모든 구성 요소에서 이 속성을 다시 정의할 필요가 없다는 것입니다.

getters: {
  user: state => state.user,
}

...mapGetters([
  "user",
]),

이것은, 「취득자를 과도하게 사용해서는 안 된다」라고 하는 몇개의 신념과는 상반되는 것이지만, 이것이 Vuex가 잘못 알고 있는 한 가지라는 것은 슬픈 현실입니다.이름 위주가 아닌 모듈은 루트 상태와 네임스페이스를 공유하기 때문에 소품도 바로 사용할 수 있어야 하지만 사용할 수 없습니다.

맵스테이트

대신 mapState를 사용하는 경우, 네스트된 구문을 파괴하는 것은 좋지 않다고 생각합니다.

...mapState({
  user: ({ auth: { user } }) => user,
}),

이것은 전혀 읽을 수 없다.소품 이름을 반복해야 하므로 코드 길이가 짧아지는 것은 아닙니다.방법은 다음과 같습니다.

...mapState({
  user: state => state.auth.user,
}),

  computed: {
   ...Vuex.mapState({
     user: ({ auth: { user } }) => user,
   }),
  },

여기 바이올린이 있다

https://jsfiddle.net/caseyjoneal/7x4p3crm/20/

언급URL : https://stackoverflow.com/questions/54428757/mapstate-on-non-namespaced-module