页面缓存解决方案
keep-alive
1. //*.vue
<template>
<router-link to:"/" />
<router-link to:"/about" />
//固定写法
<router-view v-slot={Component}>
<keep-alive :include="openedTabs" :exclude="[]">// include 要缓存的 exclude 不缓存的
<component :is="Component"/>
</keep-alive>
</router-view>
//固定写法
</template>
<script>
export default {
data(){
return {
openedTabs:['about']
}
}
}
</script>
2. //about.vue
<script>
export default {
name:'about' // 这里组件名用来缓存区分
}
</script>