source

Vuex 모듈에서 "뒤틀림"을 방지하기 위해 어떤 이름을 사용합니까?

gigabyte 2022. 8. 27. 09:52
반응형

Vuex 모듈에서 "뒤틀림"을 방지하기 위해 어떤 이름을 사용합니까?

Vuex 모듈의 "터터터링"을 피하는 데 어려움을 겪고 있습니다.대부분의 경우 모듈 이름 또한 모듈에 포함되어 있는 것처럼 보입니다.

예를 들어 사용자를 처리하는 모듈이 있다고 가정합니다.모듈 파일 이름을 지정합니다.user.js

export default {
  state: {
    users: []
  },
  // mutations and actions for reading, creating, updating users...
}

그럼 저희 가게에서는index.js

import user from 'user';

export default new Vuex.Store({
  modules: {
    user
  }
});

사용해야 하는 컴포넌트에서 사용자 목록을 가져오려면:

this.$store.user.users

사용자 목록에 모듈을 사용하지 않았다면this.$store.users훨씬 읽기 쉽고 우아합니다.

이 문제를 피할 수 있는 명명 규칙이나 디자인 패턴에 대한 아이디어가 있습니까?

를 사용할 수 있습니다.

import { mapState } from 'vuex'


export default {
  // ...
  computed: mapState({
    users: state => state.user.users
  })
  // ...
}

그럼, 을 사용할 수 있습니다.this.users에 대한 가명으로서this.$store.user.users

언급URL : https://stackoverflow.com/questions/61608679/what-naming-do-you-use-to-avoid-stuttering-in-vuex-modules

반응형