如果路由视图中指定了keep alive,如下所示

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

然后,当重新访问该路由时,所有路由都会被有效地缓存和重新加载.

我希望能够在各个路由上指定一个保持活动选项.

对于许多路由,只有1或2条需要保持活动状态,而不重新渲染缓存所有路由是无用的

is there any method of doing so or any workaround available

推荐答案

https://jsfiddle.net/Linusborg/L613xva0/4/

Vue 2.1.0版中新增了用于有条件缓存组件的includeexcludeprops .注意name选项的使用.

const Foo = {
    name: 'foo',
  template: '<div><p v-for="n in numbers">{{ n }}</p></div>',
  data: function() {
    return {
        numbers: [Math.round(Math.random() * 10), Math.round(Math.random() * 10)]
    }
  }
}

const Bar = {
    name: 'bar',
    template: '<div><p v-for="n in numbers"><strong>{{ n }}</strong></p></div>',
  data: function() {
    return {
        numbers: [Math.round(Math.random() * 10), Math.round(Math.random() * 10)]
    }
  }
}

Vue.js相关问答推荐

Vuejs 通过数据键迭代复杂对象

Vue.js 3 运行时挂载组件实例

Vue Js Composition Api 未定义(读取名称)

使用 vue / nuxt js 切换 fontawesome 图标

无需直接 DOM 操作即可绘制d3-axis

aspnet core如何在deploy上构建webpack

如何为使用 Vuex store的 Vue 表单组件编写 Jest 单元测试?

如何在 Vue.js 中使用 MaterializeCss?

等待来自 WDS 的更新信号

即使在客户端设置 Access-Control-Allow-Origin 或其他 Access-Control-Allow-* 标头后也出现 CORS 错误

命名空间模块身份验证的重复命名空间身份验证

为 webpack HMR Vue.js 包含来自外部项目文件夹的可导入模块

在组件之间共享数据

交换数组项

动态更改我的 Vue.js SPA 主题的最佳方式?

按键删除对象不会更新vue组件

使用 refs 聚焦元素目标

带有后退按钮的 Vue.js 路由

Vue如何将动态ID与v-for循环+字符串中的字段连接起来?

使用 VueJS 使用 3rd 方库打印元素