VUE 同一页面路由参数变化,视图不刷新的解决方案
1.监听路由处理
watch: {
$route(to, from) {
// 逻辑
// 重新调用数据接口
}
},
2.beforeRouteUpdate导航守卫 路由更新时触发
beforeRouteUpdate (to, from, next) {
// 逻辑
this.$route.query.xx = to.params.xx; next() // 一定要有next
},
3.只需要在入口文件设置监听事件即可
<div id="app" :key="Key"> </div> data() {
return {
Key: ''
};
},
watch: {
$route: function(newUrl, oldUrl) {
this.Key = new Date().getTime();
}
}
VUE 同一页面路由参数变化,视图不刷新的解决方案的更多相关文章
- 【问题】VUE 同一页面路由参数变化,数据不刷新
依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听,退出页面再进入另一个页面并不会运行created组件生命周期,导致数据还是第一次进入的数 ...
- vue同一个路由,但参数发生变化,页面不刷新的问题(vue监听路由参数变化重新渲染页面)
watch: { $route: function(newVal, oldVal) { console.log(oldVal); //oldVa 上一次url console.log(newVal); ...
- vue路由参数变化刷新数据
当路由到某个组件时,由于组件会复用,所以生命周期函数不会再次执行, 如果这个组件是模板组件,靠传入不同数据来显示的.那么,可能会发生参数变化了但页面数据却不变化. 问题 假如有个组件 info.vue ...
- vue监听路由的变化,跳转到同一个页面时,Url改变但视图未重新加载问题
引入:https://q.cnblogs.com/q/88214/ 解决方法: 添加路由监听,路由改变时执行监听方法 methods:{ fetchData(){ console.log('路由发送变 ...
- vue中监听路由参数变化
今天遇到一个这样的业务场景:在同一个路由下,只改变路由后面的参数值, 比如在这个页面 /aaa?id=1 ,在这个页面中点击一个按钮后 跳转到 /aaa?id=2 , 但从“/aaa?id=1”到“ ...
- vue-router4 |name的作用|query传参|parmas传参|动态路由参数|命名视图|别名alias|前置路由守卫|路由过渡效果|滚动行为
vue-router4 出现 No match found for location with path "/" #### router/index.ts文件 import { c ...
- Vue自定义页面路由
错误1:webpackEmptyContext (eval at ./src/store/modules sync recursive (0.js:10), <anonymous>:2:1 ...
- Vue下URL地址栏参数改变却不能刷新界面
在完成毕业设计(基于Vue的信息资讯展示与管理平台)的过程中,处理如下图所示的 点击左侧栏目列表跳转到对应文章列表 的问题时,初次点击可以跳转到对应的页面,但是当第二次点击时,虽然地址栏的参数改变了, ...
- vue 路由参数变化,页面不更新的问题
监控$route 在vue项目中,假使我们在同一个路由下,只是改变路由后面的参数值,如果不监听路由参数值的变化,页面无数据刷新,需手动刷新浏览器,这样做就不是我们的预期效果. 举例:当前路由为 /p ...
随机推荐
- firefox修改user-agent
让firefox对web服务器伪装成任意浏览器,找一个iphone的useragent,瞬间firefox变身iPhone有木有,一般人我不告诉他嘿嘿 1.firefox地址栏中输入about:con ...
- mysql 事件计划
一.开启mysql事件计划 首先在sql中查询计划事件的状态:SHOW VARIABLES LIKE 'event_scheduler'如果返回的是off表示当前是关闭状态,如果是on当前已经开启了计 ...
- 201671010438王奕晗实验十四 团队项目评审&课程学习总结
个人学习总结博客 项目 内容 这个作业属于哪个课程 任课教师博客主页链接 这个作业的要求在哪里 作业链接地址 作业学习目标 完成个人软件心得总结 一.结合本学期课程学习内容,对比<实验一 软件工 ...
- 运维常用shell脚本之日志清理
1.创建一个日志清理脚本 #/bin/bash for i in `find /root/.pm2/logs -name "*.log"` do cat /dev/null > ...
- 2.Vue.js 是什么
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架. 与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用. Vue 的核心库只关注视图层,不仅易于上手,还便 ...
- 在IDEA编辑器中建立Spring Cloud的子项目包(构建微服务)
本文介绍在IDEA编辑器中建立Spring Cloud的子项目包 总共分为5个包: 外层使用maven quickstart建立,子modules直接选择了springboot
- GIT-本地仓库
用户配置 git config --global user.name "name" git config --global user.email "123@qq.com& ...
- [Gamma]Scrum Meeting#1
github 本次会议项目由PM召开,时间为5月26日晚上10点30分 时长25分钟 任务表格 人员 昨日工作 下一步工作 木鬼 撰写博客,组织例会 swoip 前端显示屏幕,翻译坐标 bhlt 后端 ...
- mstar 平台I2C 配置
芯片的pin 脚可以用作不同的功能,总结一句就是外设进行状态和数据交换. 最常用的是作为GPIO,设置为输出模式时,通过高低电平来控制一些外围设置:// 如LED,屏的电源,背光的开关,功放的静音等等 ...
- 避免git clone和push时每次都需要输入用户名和密码
有三种方式解决git clone时每次都需要输入用户名和密码, 1. SSH免密方式 使用git bash ssh-keygen或puttygen.exe生成公钥. 2. 配置全局开机存储认证信息 下 ...