工具函数

/**

 * set item

 *  name

 *  value

 *  expires, ms

 */

  setItem(name, value, expires) {

    if (!localStorage) {

      console.log('unsupport localStorage');

      return;

    }

    var obj = {};

    obj.value = value;

    if (expires) obj.expires = Date.now() + expires;

    localStorage.setItem(name, JSON.stringify(obj));

  },

  /**

   * get item

   *  name

   */

  getItem(name) {

    if (!localStorage) {

      console.log('unsupport localStorage');

      return;

    }

    var objStr = localStorage.getItem(name);

    var obj;

    try {

      obj = JSON.parse(objStr);

    } catch (e) {

      console.log('json parse error:');

      console.log(e);

    }

    if (!obj) return;

    if (obj.expires && obj.expires < Date.now()) {

      localStorage.removeItem(name);

      return;

    }

    return obj.value;

  },

路由添加

        meta: {

          keepAlive: true,

          require:true,

        }

路由前置守卫

router.beforeEach((to, from, next) => {

  if (to.meta.require == true) {

    if (tools.getItem(to.fullPath)) {

      to.meta.keepAlive = true

    } else {

      tools.setItem(to.fullPath, 1, 120000)

      to.meta.keepAlive = false;

    }

  }

  next()

})

渲染

  <keep-alive>

        <router-view v-if="$route.meta.keepAlive"></router-view>

      </keep-alive>

      <router-view v-if="!$route.meta.keepAlive"></router-view>