vue中params-解决换路由不刷新问题
因为依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听,退出页面再进入另一个文章页面并不会运行created组件生命周期,导致文章数据还是第一次进入的数据。
解决方法:watch监听路由是否变化。
watch: {
// 方法1
'$route' (to, from ) {
//监听路由是否变化
if(this .$route. params .articleId){
// 判断条件1 判断传递值的变化
//获取文章数据
}
}
//方法2
'$route' (to, from ) {
if(to.path == "/page" ) {
/// 判断条件2 监听路由名 监听你从什么路由跳转过来的
this .message = this.$route.query.msg
}
}
}
喜欢的小伙伴可以关注我的微信公众“前端伪大叔”

vue中params-解决换路由不刷新问题的更多相关文章
- Vue中使用children实现路由的嵌套
Vue中使用children实现路由的嵌套 相关Html: <!DOCTYPE html> <html lang="en"> <head> &l ...
- vue中router跳转本页刷新
问题: 导航栏的地址发生改变但是页面却不刷新 (用vue-router路由到当前页面,页面是不进行刷新的)解决: 1.); 2.location.reload() ...
- vue中如何不通过路由直接获取url中的参数
前言:为什么要不通过路由直接获取url中的参数? vue中使用路由的方式设置url参数,但是这种方式必须要在路径中附带参数,而且这个参数是需要在vue的路由中提前设置好的. 相对来说,在某些情况下直接 ...
- vue 中 this.$router.push() 路由跳转传参 及 参数接收的方法
传递参数的方法:1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用name ...
- vue中v-cloak解决刷新或者加载出现闪烁(显示变量)
在使用vue绑定数据的时候,渲染页面时会出现变量闪烁,例如 <div class="#app"> <p>{{value.name}}</p> & ...
- 【Vue中的坑】路由相同参数不同无法触发路由
场景: vue实现导航栏,二级导航栏跳转到相同页面,通过参数来实现到该页面后,根据参数来滚动到对应到位置 网上的解决方法: 通常情况下我们喜欢设置keepAlive 包裹 router-view &l ...
- vue 使用localStorage解决vuex在页面刷新后数据被清除的问题
通常,我们在使用vue编写页面时,会需要使用vuex在组件间传递(或者说共同响应)同一个数据的变化.例如:用户的登录信息. 下面,我们使用传递用户登录信息的例子来一步步解决这个问题. 首先,我们的第一 ...
- 064——VUE中vue-router之使用路由别名定制(alias)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue中的组件及路由使用
1.组件是什么 组件系统是 Vue 的一个重要概念,因为它是一种抽象,允许我们使用小型.独立和通常可复用的组件构建大型应用.通常一个应用会以一棵嵌套的组件树的形式来组织: 1.1组件的声 ...
随机推荐
- P4095 [HEOI2013]Eden 的新背包问题
P4095 [HEOI2013]Eden 的新背包问题 题解 既然假定第 i 个物品不可以选,那么我们就设置两个数组 dpl[][] 正序选前i个物品,dpr[][] 倒序选前i个物品 ,价格不超过 ...
- gitlib的安装
下载ruby yum -y install gcc gcc-c++ make wget https://cache.ruby-lang.org/pub/ruby/2.1/ruby-2.1.9.tar. ...
- CentOS 7 应用
为方便以下CentOS7简称C7,CentOS6简称C6 优化 1.安装常用功能 yum -y install bash-completion lrzsz telnet tree vim wget n ...
- Makefile.am和makefile.in生成Makefile
Makefile.am和makefile.in生成Makefile 很多时候,我们在网上下载的linux开源软件都会遇到一个问题,就是源码里面没有直接的makefile,但是它有Makefile.am ...
- 004-Spring boot 快速入门-项目搭建与启动、SpringBootApplication、启动图标
一.官方地址 Spring:http://spring.io/ Spring Project:http://spring.io/projects Spring boot:https://project ...
- [ML] Load and preview large scale data
Ref: [Feature] Preprocessing tutorial 主要是 “无量纲化” 之前的部分. 加载数据 一.大数据源 http://archive.ics.uci.edu/ml/ht ...
- php上传文件夹
用过浏览器的开发人员都对大文件上传与下载比较困扰,之前遇到了一个php文件夹上传下载的问题,无奈之下自己开发了一套文件上传控件,在这里分享一下.希望能对你有所帮助. 以下是实例的部分脚本文件与代码: ...
- chrome下常用插件
1.xdebug helper 配合PhpStorm使用调试PHP 2.json-handle 格式化JSON返回数据 3.website ip 查看当前网站IP 4.host switch plus ...
- java内存模型的原子性、可见性、有序性与指令重排序
在并发编程中,我们通常会遇到以下三个概念:原子性.可见性和有序性.我们先看具体看一下这三个概念: 1.原子性 操作时不可分割的比如a=0,此操作不可分割,而++a,实际上是a=a+1,为两个操作.想将 ...
- maven——将jar安装到本地仓库
环境变量MAVEN_HOME配置正确后,cmd窗口执行此命令: mvn install:install-file -Dfile=C:\hehe.jar -DgroupId=com.rockontro ...