刷新vue.js keep alive部分中的页面

我不认为有一个简单的方法可以做到这一点( )所以你只有两个选择。

选项1 将是重置状态,这意味着您在内部跟踪初始状态,并侦听类似于注销时发出的消息来重置状态 组件的初始状态。

方案2 只是换掉 keep-alive 组件使用如下方式:

<keep-alive v-if="loggedIn">
    <router-view></router-view>
</keep-alive>

<router-view v-else></router-view>

Vue.prototype.$loginState = new Vue();

在组件中,单击logout按钮触发事件。

function logout(){
    //your codes here to logout and then
    this.$loginState.$emit('logout');
}

<button @click="resetValues"> Logout </button>
methods: {
    resetValues(){
        this.yourValue = '';
        this.filters = [];
    }
}
created(){
    this.$loginState.$on('logout', this.resetValues)
}

带电部件在里面 this.$children ,所以您可以遍历它们并修改状态。