vue功能实现一:重载页面

全部的,请看https://www.jianshu.com/p/93281f5c2b38

重载页面(最简单方法,直接在入口文件APP.vue处处理)

全局引用,不需要针对个别页面处理,简化开发工作量

  • 添加state
const state = {
    isReload: false, // 是否需要重加载页面组件
}
  • 创建mutation方法
// 是否需要重载
[IS_RELOAD](state) {
    state.isReload = !state.isReload;
}
  • 在入口处设置激活组件
<router-view class='router-view' v-if="isRouterAlive"></router-view>
// 设置data数据
isRouterAlive: true
// watch监听isReload状态
isReload(value) {
  // 一旦发生变化则重载组件
    this.isRouterAlive = false;
    this.$nextTick(() => {
      this.isRouterAlive = true;
    })
}
  • 通过改变isReload状态来实现重载页面
this.$store.commit('IS_RELOAD');
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。