当前位置: 首页 > news >正文

Vue 路由切换时页面内容没有重新加载

为什么80%的码农都做不了架构师?>>>   hot3.png

第二次进入页面,页面路由参数已经改变,但是页面内容不会刷新。

问题原因:在组件mounted钩子中调用的刷新页面内容,但测试发现这个钩子没有被调用。后来发现App.vue中使用了<keep-alive>:

<template>
  <div id="app">
    <keep-alive>
      <router-view></router-view>
    </keep-alive>
  </div>
</template>
keep-alive是Vue的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM。这就是问题所在了。

解决办法:

使用Vue组件切换过程钩子activated(keep-alive组件激活时调用),而不是挂载钩子mounted:

<script>
export default {
  // ...
  activated: function() {
    this.getCase()
  }
}
</script>
关于keep-alive组件的钩子:https://cn.vuejs.org/v2/api/#activated


--------------------- 
作者:木马啊 
来源:CSDN 
原文:https://blog.csdn.net/u010419337/article/details/79443360 
版权声明:本文为博主原创文章,转载请附上博文链接!

转载于:https://my.oschina.net/hrw/blog/2962114

相关文章:

  • 303. Range Sum Query - Immutable
  • 从“被动挖光缆”到“主动剪网线”,蚂蚁金服异地多活的微服务体系
  • 冲刺第四天 11.28 WED
  • Spark 用户自定义函数 Java 示例
  • jQuery焦点图插件
  • Go之路
  • 全栈开发——Linux
  • cfile fopen fopen_s win10下打开文件失败
  • Android实现摇晃手机的监听(摇一摇)
  • SVN服务器迁移实战
  • Ceisum官方教程2 -- 项目实例(workshop)
  • 月薪1.5W以下的数据分析师·面试流程(附赠考题)
  • 事故现场:mysql自增id超大问题查询
  • ubuntu下直接可视化访问服务器文件夹方法
  • 九、sparkStream的scala示例
  • java 多线程基础, 我觉得还是有必要看看的
  • JavaScript 一些 DOM 的知识点
  • Javascript 原型链
  • JS 面试题总结
  • mysql 数据库四种事务隔离级别
  • MySQL常见的两种存储引擎:MyISAM与InnoDB的爱恨情仇
  • ng6--错误信息小结(持续更新)
  • ReactNative开发常用的三方模块
  • React-生命周期杂记
  • SpringCloud(第 039 篇)链接Mysql数据库,通过JpaRepository编写数据库访问
  • 阿里云购买磁盘后挂载
  • 关于for循环的简单归纳
  • 关于使用markdown的方法(引自CSDN教程)
  • 离散点最小(凸)包围边界查找
  • 两列自适应布局方案整理
  • 提醒我喝水chrome插件开发指南
  • mysql面试题分组并合并列
  • ​ssh-keyscan命令--Linux命令应用大词典729个命令解读
  • #include<初见C语言之指针(5)>
  • #微信小程序(布局、渲染层基础知识)
  • (Java岗)秋招打卡!一本学历拿下美团、阿里、快手、米哈游offer
  • (独孤九剑)--文件系统
  • (附源码)ssm失物招领系统 毕业设计 182317
  • (企业 / 公司项目)前端使用pingyin-pro将汉字转成拼音
  • (三)c52学习之旅-点亮LED灯
  • (数据结构)顺序表的定义
  • (转)linux 命令大全
  • (转)使用VMware vSphere标准交换机设置网络连接
  • **PHP二维数组遍历时同时赋值
  • .babyk勒索病毒解析:恶意更新如何威胁您的数据安全
  • .cn根服务器被攻击之后
  • .NET 5种线程安全集合
  • .net core 微服务_.NET Core 3.0中用 Code-First 方式创建 gRPC 服务与客户端
  • .net core 依赖注入的基本用发
  • .NET 回调、接口回调、 委托
  • .NET 解决重复提交问题
  • .NET文档生成工具ADB使用图文教程
  • .vue文件怎么使用_vue调试工具vue-devtools的安装
  • @property括号内属性讲解
  • [ vulhub漏洞复现篇 ] Django SQL注入漏洞复现 CVE-2021-35042