无法在重新加载页面后将 mapState 的值分配给 data 属性,如果您转到子页面,它可以工作,但如果您已经站在子页面并重新加载浏览器,则不会。
计算的 mapState
computed: {
...mapState({
tsStore: state => state.SchemeStore
})
}
数据属性
data () {
return {
works: '',
offTime: '',
}
}
已安装
if (this.tsStore.singleView) {
// Set data based on api.
let single = this.tsStore.singleView
this.works = single.works
this.offTime = single.offTime
}
重新加载后 works
和 offTime
在数据属性中变空。
最佳答案
是的,问题是 state
在组件被 mounted
后更新;
因此,将调用 updated
方法而不是 mounted
。
在这个 fiddle 中可见,其中 API 调用由 setTimeout
模拟:
https://jsfiddle.net/eywraw8t/369915/
我认为更新组件的最佳方法是使用计算属性
,其中 Vue 实现了代理来监视变化,就像这个 fiddle 一样:
https://jsfiddle.net/3mn2xgvr/
我将更改移至计算属性,因此当 Vuex 中的状态发生变化时,所有依赖于该状态的数据都会发生变化。
关于vue.js - VueJS - 重新加载页面后无法将 mapState 的值分配给数据属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52353370/