- 从一个页面跳转另个页面,再返回,第一个页面会重新渲染,如何能不渲染呢?也就用到了keep-alive。
Vue3 用法
-
keep-alive属性“include,exclude”的使用
注意:使用include,exclude 属性需要给所有vue类的name赋值,否则 include,exclude将不生效
include 值为字符串或者正则表达式匹配的组件name不会被销毁。
exclude 值为字符串或正则表达式匹配的组件name会被销毁。
例子如下:name为playView的界面,
router.push()
新界面时,它不会被unmount
掉;从新界面history.back()
也不会重新渲染,不会执行setup()
<router-view v-slot="{ Component }">
<transition>
<keep-alive include="playView">
<component :is="Component" />
</keep-alive>
</transition>
</router-view>
Vue2 用法
<keep-alive>
<router-view />
</keep-alive>