vue2.0 如何实现页面缓存

Question

vue新闻项目

数据请求，是通过点击上面的分类（所以分类共用一个数据请求页面），监控路由变化，只要路由变化就会请求数据，这样的话页面请求的数据就缓存不了

watch: {
    $route: function() {
      // if (this.routerChange) {
        this.getNews()
      // }
    }
  },
  methods: {
    ...mapActions(['getList', 'dowmLoadmore']),
    getFirstNews(){
      this.getList({
        channel: this.firstName,
        type: this.firstType,
        flag: this.routerChange
      })
    },
    getNews() {
      this.getList({
          channel: this.$route.query.type,
          type: this.$route.params.type,
          flag: this.routerChange
        })

keep-alive也开启了

{
      path: '/header',
      name: 'Header',
      component: Header,
      meta:{  keepAlive: false },
      children: [
        {
          path: '/home/:type',
          name: 'Home',
          component: Home,
          meta:{  keepAlive: true  }
        }
      ]
    },

现在还是只要切换分类，页面就会刷新，不知道该怎么改了

Answer 1

你这样可以用不同的字段保存 每个栏目的数据，点击切换的时候通过分类去 判断对应的字段数据是否为空，为空就发送请求请求数据，不为空就直接渲染，我能想到的方法就是这样。你一个组件，不同数据，不能缓存吧。

Answer 2

    <keep-alive>
      <router-view></router-view>
 </keep-alive>

把你的父容器Header这样写