vue data恢复初始化数据的实现方法
场景:当适用keepAlive保留页面的时候我们会使用到如下代码<template><div id="app"><!-- isRouterAlive全局刷新 --><div v-if="isRouterAlive"><keep-alive><router-view v...
·
场景:当适用keepAlive保留页面的时候我们会使用到如下代码
<template>
<div id="app">
<!-- isRouterAlive全局刷新 -->
<div v-if="isRouterAlive">
<keep-alive>
<router-view v-if="$route.meta.keepAlive">
<!-- 这里是会被缓存的视图组件,比如列表A页面 -->
</router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive">
<!-- 这里是不被缓存的视图组件,比如详情B页面-->
</router-view>
</div>
</div>
</template>
那么在再次进入这些页面的时候,我们需要重置该页面的原始数据,那么该如何进行呢?
解决办法
Object.assign(this.$data, this.$options.data())
我是如此使用的
beforeRouteEnter(to, from, next) {
next(vm => {
if (from.name == "Navs") {
Object.assign(vm.$data, vm.$options.data());
vm.initPage();
}
});
},
更多推荐
已为社区贡献30条内容
所有评论(0)