vue.js 2.0项目遇到的问题整理（持续更新中）

问题一：vue.js 如何设置某个组件不被keep-alive?

vue.js 2.1.0+可设置

<keep-alive>

的

include

或

exclude

属性来条件控制组件的缓存

<keep-alive include="RegularBusList">
<router-view></router-view>
</keep-alive>

链接直达：keep-alive

问题二：vue.js 被keep-alive的组件如何主动销毁?

问题：

在

<router-view>

标签

include

两个不同路由的组件A、B，并且在组件的

watch

属性添加

$route

的监听器用于获取更新数据，当A组件被缓存后，切换路由进入B组件页面，B组件被缓存，此时进入页面会触发A组件

$route

的监听器，怎么在进入B组件时销毁被缓存的A组件？

不可行方案：

当页面要进入的是B组件所在页面时，在A组件的

beforeRouteLeave

钩子函数中调用

this.$destroy()

；这样能清除缓存，但是发现下次重新进入A组件页面时，新创建的A组件不会被缓存；还会出现一些奇怪的问题

解决方案：

vue.js 2.5.0+可设置

<keep-alive>

的

max

属性(设置为

1

时进入B组件时会清除A组件的缓存，不会触发A组件

$route

的监听器)

相关链接：

issue

尤大的commit