vue2.0之页面缓存问题

Question

比如有一个列表页面，然后列表每项都有一个详情
在vue2.0中出现了列表页面是每次都重新加载数据，但是详情页面却只在第一次加载的时候调用数据，如果返回到列表再进入详情那么页面是不会重新渲染页面

Answer 1

你可以在路由钩子里面做请求。不要在created钩子里面，在beforeRouteEnter钩子里面
比如这样
vm就是当前的Vue实例

Answer 2

需要在某个生命钩子里重新获取数据，具体哪个看官方文档吧

Answer 3

我在想你所谓的“详情”是不是弹出一个Modal或者仅仅显示一个div，没有@lavyun提到的路由变化？
如果你的浏览器的href没有变化不会触发路由更新，而路由更新，本身就会重新请求数据。
如果是用div展示详情，你需要用v-if，点击“详情”时，让v-if等于true，就会重建div。

Answer 4

如果你的详情页的路由类似这样/items/:id的话，你可以

watch: {
 '$route': function(){
   this.fetchData()
 }
},
methods: {
   fetchData () {
   
   }
}

官网例子

Answer 5

这个需求在移动web app上很常见，最方便的方案是在底层把缓存的问题做掉，我开发了一个库来解决这个需求，代码不复杂，可以参考下：vue-navigation，以及库的实现思路：基于vue的移动web app页面缓存解决方案。