[英]Vuex store change not updating the component
我面临一个问题,在更新我的商店值isRenewalFlow
后,我的组件没有得到更新。
在调试时,我发现在突变[MUTATION_TYPES.IS_RENEWAL_FLOW]
更新存储值后没有调用组件的updated
生命周期。 甚至商店 getter 中的getIsRenewalFlow
也只在开始时调用一次,而不是在突变内部的商店更新之后调用。
这是代码。
店铺
const state = {
isRenewalFlow: undefined,
}
const getters = {
getIsRenewalFlow: (state) => state.isRenewalFlow,
}
const actions = {
[ACTION_TYPES.POPULATE_QUOTE_DATA]: (
{ dispatch, commit, state, rootState, getters }, payload
) => {
commit(MUTATION_TYPES.IS_RENEWAL_FLOW, payload)
}
}
const mutations = {
[MUTATION_TYPES.IS_RENEWAL_FLOW]: (state, payload) => {
state.isRenewalFlow = payload
},
}
零件
export default Vue.extend({
components: {
ErrorBoundary: () => import('@/components/common/ErrorBoundary.vue'),
},
computed: {
...mapGetters({
getIsRenewalFlow: 'getIsRenewalFlow',
}),
},
mounted() {
this.getIsRenewalFlow !== undefined &&
someFunc()
},
updated() {
this.getIsRenewalFlow !== undefined &&
someFunc()
},
})
即使在state.isRenewalFlow
更新了true
或false
内部mutations
[MUTATION_TYPES.IS_RENEWAL_FLOW]
之后, someFunc
也永远不会被调用
updated
钩子与 DOM 中的更改有关,如果此状态未更新 DOM,您将不会看到调用updated
。
来自https://v2.vuejs.org/v2/guide/instance.html#Lifecycle-Diagram :
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.