城市切换章节，页面刷新vuex状态清空的问题

Question

老师您好，我这个问题其他同学都有遇到，但是都没有好的解决方法，具体情况是这样的：我们在handleSelect函数中用commit修改了state中position的状态，再用location.href的方式跳回首页。那么问题来了，跳转之后会重新刷新页面，页面一刷新vuex的状态随之清空，然后执行nuxtServerInit方法，这样就导致不管你如何切换城市，页面一刷新还是显示天津市，也就是你定位的城市。我本来想在handleselect的时候做个sessionStorage的存储，然后在页面渲染完成后再读取sessionStorage，但是效果并不好，都要闪一下，又想在vuex的mutations里面直接获取sessionStorage，然后人家根本就没有这个方法，sessionStorage undefined！万般无奈之下来这里求助老师，望解答！

Answer 1

WTF3310961 2019-08-29 18:43:04

我用cookie实现了，在接口那里获取cookie判断cookie是否为空

• 快乐动起来呀 #1

  赞独立解决问题的能力

Answer 2

淡水狗 2019-09-29 16:55:11

我也是这样 请问解决了嘛

• AKhui #1

  使用在iselect.vue里面使用this.$router.push({path:'/'})，代码如下：
  handleSelect:function(item){
              this.$store.commit('geo/setPosition',{city:item.value})
              this.$router.push({path:'/'})
          }

• 淡水狗 回复 AKhui #2

  谢谢你

• AKhui 回复 淡水狗 #3

  不客气，互相学习

点开查看后面1条评论

Answer 3

fengyunzhu 2019-10-16 10:01:06

老师以为只是一个跳转，其实这块难度挺大的，需要考虑两点

1. 要把新的城市写入到store里，难度1.5颗星

2. 使用window.location.href=""跳转或者刷新页面，store又重新获取定位，把你的城市替换成默认的了，难度3-5颗星

Answer 4

阿J脚步 2019-09-29 13:49:38

可以分享下代码嘛 万分感谢

• AKhui #1

  使用在iselect.vue里面使用this.$router.push({path:'/'})，代码如下：
  handleSelect:function(item){
              this.$store.commit('geo/setPosition',{city:item.value})
              this.$router.push({path:'/'})
          }

• 阿J脚步 #2

  谢谢你啊

• AKhui 回复 阿J脚步 #3

  不客气，互相学习