1创建一个js文件
import { mapGetters } from "vuex";
export default function () {
return {
computed: mapGetters(['keepAliveList']),
activated() {
let that = this;
let refresh = true;
this.keepAliveList.map(item => {
if (item == that.$route.fullPath) refresh = false;
});
try {
if (refresh && that.refresh)
that.refresh();
} catch (error) {
console.log('keepAliveManage:页面刷新失败')
}
},
created() {
this.$store.commit('ADD_KEEPALIVE_PATH', this.$route.fullPath);
},
beforeDestroy() {
this.$store.commit('REMOVE_KEEPALIVE_PATH', this.$route.fullPath);
}
}
}
2在vue中混入第一步创建的文件
3在vue中创建fresh方法,在fresh方法中进行刷新
我的项目是有标签的当关闭标签的时候并没有销毁页面,需要在关闭标签的时候调用下
this.$store.commit('REMOVE_KEEPALIVE_PATH', this.$route.fullPath);
本文介绍了如何解决Vue应用中使用keep-alive缓存后,再次打开页面不刷新的问题。通过创建一个js文件,混入计算属性和生命周期钩子,实现了根据路由判断是否需要刷新页面。在组件的activated钩子中检查当前页面是否需要刷新,并在created和beforeDestroy钩子中管理缓存路径。此外,还提到在标签关闭时需要手动移除缓存路径以确保页面正确销毁。
319

被折叠的 条评论
为什么被折叠?



