Vuex 在跳转页面前后如何保持 State 一致性？

Question

我这么问好了！
比如，我写一个无限循环，一直在后面跑

while true {
var n = 1
store.commit('xxxstate',n++)
}

前端怎么能够实时监控到 state 的变化呢？

题主真正的需求是这样的：

有一个 login.js，用户从 login.vue 调用 login.js 登录之后，在login.js 里请求服务器数据，并commit给 Vuex State，也就是登录之后跳转到的 index.vue 并没有参与数据请求和 commit to vuex 这个事情，在 index.vue 无法获取在 login.vue 中更新得 state。

Answer 1

store之后在页面通过

export default { 
    computed: { 
        ...mapState(['state']) 
    }
}

这样之后，在函数里或者页面里，引用的state就是实时变化的了

Answer 2

其实我的需求没那么奇怪，真正的需求是这样的：有一个 login.js，用户从 login.vue 调用 login.js 登录之后，在login.js 里请求服务器数据，并commit给 Vuex State，也就是登录之后跳转到的 index.vue 并没有参与数据请求和commit to vuex 这个事情，但就是想要在 index.vue 中获取到最新的 state，就获取不到

Answer 3

首先 javascript 是单线程语言，因此理论上只能同步执行，所谓的异步只是一种设计机制，相当于主线程工作完成之后，主线程去查看一下有没有需要执行的异步任务，有的话主线程执行需要自行的异步任务之后，继续执行主线任务，也就是从始至终只有主线程一个人在干活。

那么你代码中的 while(true) 循环等于是吧主线程阻塞了，不要说 vuex 无法同步状态，甚至你的网页本身就已经卡住无法运行下去了。