반응형
Vue 동적 mapGetters
동적 mapGetters를 만들기 위해 사용하는 소품이 있지만, mapGetters는 소품보다 먼저 계산되어 있기 때문에 소품이 정의되지 않은 것으로 인식합니다.내가 어떻게 역동적으로 만들 수 있는지 아는 사람 있어?코드는 다음과 같습니다.
export default {
props: ['listType'],
components: {
addrow: AddRow
},
computed: {
...mapGetters({
list: `${this.listType}/list`,
current: 'Dropdown/current'
})
},
}
[업데이트] @boussadjrabrahim 덕분에 솔루션을 찾았습니다.작업 코드는 다음과 같습니다.
export default {
props: ['listType'],
components: {
addrow: AddRow
},
computed: {
...mapGetters({
current: 'Dropdown/current'
}),
...mapState({
list (state, getters) {
return getters[`${this.listType}/list`]
}
})
}
}
를 사용할 수도 있습니다.this.$store
스토어에 완전히 액세스 할 수 있습니다.그렇게,list
될 것이다
export default {
props: ['listType'],
computed: {
list() {
return this.$store.getters[`${this.listType}/list`]
}
}
}
디스패치 메서드를 사용하여 다음과 같은 액션을 트리거합니다.
export default {
props: ['listType'],
methods: {
sortList(order) {
this.$store.dispatch(`${this.listType}/list`, order)
}
}
}
내가 찾은 것은 기본적으로 당신 자신의 것을 굴리는 것이었다.mapGetters
의 메서드created()
라이프 사이클의 스테이지.
이 솔루션은 아직 충분히 검증되지 않았기 때문에, 어떠한 「취득」이 생기는지 알 수 없습니다.항상 그렇듯이, 경고의 공허자.
export default {
props: ['listType'],
components: {
addrow: AddRow
},
created() {
// This can be configured a number of ways, but for brevity:
const mappableGetters = {
list: `${this.listType}/list`,
current: 'Dropdown/current'
}
Object.entries(mappableGetters).forEach(([key, value]) => {
// Dynamically defines a new getter on `this`
Object.defineProperty(this, key, { get: () => { return this.$store.getters[value] } })
})
// Now you can use: `this.list` throughout the component
},
computed: {
// Roll your own mapper above in `created()`
// ...mapGetters({
// list: `${this.listType}/list`,
// current: 'Dropdown/current'
// })
}
}
언급URL : https://stackoverflow.com/questions/52577895/vue-dynamic-mapgetters
반응형
'programing' 카테고리의 다른 글
"기호를 찾을 수 없음" 또는 "기호를 확인할 수 없음" 오류는 무엇을 의미합니까? (0) | 2022.07.11 |
---|---|
프로세스 데몬 생성 방법 (0) | 2022.07.11 |
Allow AnyOrigin Cors가 작동하지 않음Axios Vuejs (0) | 2022.07.11 |
새 문자열 값을 올바르게 할당하려면 어떻게 해야 합니까? (0) | 2022.07.11 |
"TypeError: 정의되지 않은 속성 'get'을 읽을 수 없습니다", Axios, Vue.JS (0) | 2022.07.11 |