$this.router.push到当前页面,只是传入参数不同,页面不刷新的问题解决入门基础知识_刷新教程视频

$this.router.push到当前页面,只是传入参数不同,页面不刷新的问题解决入门基础知识

$this.router.push到当前页面,只是传入参数不同,页面不刷新的问题解决入门基础知识_刷新教程视频

问题

在vue中使用$this.router.push()方法,如果只是传入的参数不同,会出现url地址变化了,但是页面没有重新请求数据,需要刷新一下页面才有新的数据加载。

解决方式

方式1:监听路由的变化

在页面的watch中,监听$router的变化

watch: {
    $route (to, from) {
      this.$router.go(0)
    }
}

其中this.$router.go(0)为刷新页面,但此方法可能在Safari中无法实现,还可以用js原生的方法:window.location.reload()。

方式2:直接请求接口更新页面

如果是同页面,可以不使用路由方式实现。直接在页面内部逻辑处理即可。  

海计划公众号
(0)
上一篇 2020/03/20 04:05
下一篇 2020/03/20 04:05

您可能感兴趣的内容

  • js中cookie操作总结:cookie设置,读取,删除,判断是否存在小白指南_存储基础指南

    这篇文章将简单介绍通过Js对cookie的相关操作,网上也有很多类似或者重复的文章了。cookie基础操作知识,这里在一次总结一下。Cookie的解释有时也用其复数形式 Cookies,指某些网站为了辨别用户身份、进行 session 跟踪而储存在用户本地终端上的数据(通常经过加密) 设置cookiesetCookie:function(name,valu

    2020/03/26
  • 我所经历的996使用指南_996使用说明

    | 996指的是早9点上班晚9点下班,一周工作6天。几年前,我从小报跳去一家互联网公司做原创。小报记者的工作很清闲,每天早上十点半上班,下午三点半就下班了。那时候对互联网公司没啥概念,也不知道自己差不多是以最差履历入职中国最好互联网公司的那个幸运儿。可能那会转行唯一想的是,我还年轻,我不能老这么混日子。果然,转行的那一年,生活一下子被颠覆了。一年365天,

    2020/03/29
  • dot-dom使用指南_一个用于嵌入式项目的微型虚拟DOM模板引擎

    dot-dom使用指南 官方网址:# GitHub:https://github.com/wavesoft/dot-dom 简介描述:一个用于嵌入式项目的微型虚拟DOM模板引擎 适…

    2020/03/12
  • 十大热门语言及发明者大盘点基础教程_语言小白常识

    软件领域有许多编程语言,每年还涌现出越来越的新语言。新发布的语言有Scala、Kotlin、Go和Closure,但历史证明,只有少数语言能存活下来,其中一些语言对软件领域的发展做出了巨大贡献。编程语言是软件领域的重要一环,虽然大家对热门的编程语言了解较多,例如大家都知道詹姆斯·高斯林发明了Java,但不是每个人都知道Perl,Pascal, Lisp,或是

    2020/04/03
  • ScrollDir教程视频_利用 CSS 来控制垂直滚动的 JavaScript 插件

    ScrollDir教程视频 官方网址:https://dollarshaveclub.github.io/scrolldir/ GitHub:https://github.com/…

    2020/03/06
  • 关于Js防抖与节流的思考小白知识_优化攻略教程

    1,比较正式的解释他们的区别:防抖:就是指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间,防抖注重结果节流::是让一个函数无法在很短的时间间隔内连续调用,当上一次执行完之后过了规定的时间间隔,才能进行下一次的函数调用,节流注重过程2,非官方解释 防抖:A打了一个B一下,B开始哭(假设哭5分钟),在这5分钟内A一

    Web前端 2020/03/26
  • iframe onload事件被block的坑入门基础教程_iframe基础知识

    写在前面最近接手了一个古旧的项目,跟客户端、服务器端一起调一个支付相关的app内嵌H5页面,这个页面有两部分组成,主页面A加上一个最终支付页面B,B页面是通过iframe嵌入到A页面中的,A、B两个页面之间的交互采用postMessage+hashChange。一般除了下载之类的需求,我很少在自己的项目中使用iframe,像这样的两个页面切换的问题,第一反应

    2020/03/26
  • 如何从零基础成为优秀的Web前端开发人员?零基础入门_前端使用帮助

    你想成为一名Web开发人员,有一个问题,在技术行业还没有经验。你可能上了很多课程并且也写了很多个人项目,但是简历上经验一栏却始终和你没有什么关系。转型到一个新的领域并不是那么容易,你想知道你是否已经准备好了,是否有人会认真的对待你,最重要的是你是否能得到工作。相信我:不要让那些担心阻碍你前进的道路。事实上它没有那么困难,只要你已经确定你已经充分准备好转型了。

    2020/03/23
  • 优质的圈子,有多么重要?小白基础_话题教程视频

    1今天偶然想到了这个话题,姑且来谈谈。好多人其实都知道,我大学学的是国际商务,这是一个跟计算机八竿子都打不着的专业。后来我自己学习了计算机方面的一些知识,在最开始的时候,可能大一大二的样子吧,还想着去本学校计算机专业班级蹭课,顺便多认识一些懂计算机的老师和同学。所以那时我在很多的 QQ 群里面找到了一些计算机专业的人,问他们要了课表,但是后来一次都没有去,究

    2020/03/30
  • commander.js使用帮助一个轻巧的nodejs模块,提供了用户命令行输入和参数解析强大功能

    commander.js小白入门 官方网址:http://tj.github.io/commander.js/ GitHub:https://github.com/tj/comma…

    2020/03/06
  • 新手学习WEB前端流程以及学习中常见的误区入门基础_学习小白教程

    学习web前端编程技术肯定是以就业拿到高薪工作为主要目的的,可是高薪不会那么轻易拿到,这是一个最简单的道理。没有付出就没有回报,在整个学习web前端编程技术的过程中,你需要付出时间、精力、金钱。废话不多说直接上干货。在开始学习之前你需要做到以下5点:第一:需要达到什么样的技术水平才能就业?既然是为了就业,你就要知道学习web前端编程技术需要达到什么样的技术水

    2020/03/29
  • 网站地图制作,网站地图的主要作用菜鸟教程下载_网站入门教程

    一些做SEO网站优化的朋友经常听到“站点地图”这个词。那么什么是站点地图呢?我们能做什么?我们应该如何制作和查看一个网站的地图?该网站地图实际上是一个集合所有链接到我们的网站在一个单一的文件,有一些大的网站,网站的水平是非常深,有一些网页,需要多次点击打开。此时,我们需要制作一个网站地图,以优化网站的用户体验和搜索引擎蜘蛛的难度。总的来说,我们网站的内容已经

    2020/03/31
  • Js中各种源码实现(前端面试笔试必备)基础入门_面试教程视频

    Js中各种源码实现(前端面试笔试必备)基础入门 前言 能够手撕各种JavaScript原生函数,可以说是进大厂必备!同时对JavaScript源码的学习和实现也能帮助我们快速扎实地…

    2020/03/20
  • 移动端开发必须知道的小技巧菜鸟教程_技巧菜鸟教程网

    最近在公司写一个混合 app 项目,页面基本全部都是用 H5 完成,嵌入到原生 webview 下。发现一个问题,在 iPhone 6 下 苹果手机的状态栏会挡住页面,导致页面下移,样式错乱,最后网上查找了些解决办法,加了一条 meta 标签解决了问题。今天特来总结下常用的移动端开发需要注意的meta标签及一些小技巧。viewport<meta name="

    2020/03/26
  • Web Workers 到底是什么?使用教程_线程小白帮助

    以前我们总说,JS是单线程没有多线程,当JS在页面中运行长耗时同步任务的时候就会导致页面假死影响用户体验,从而需要设置把任务放在任务队列中;执行任务队列中的任务也并非多线程进行的,然而现在HTML5提供了我们前端开发这样的能力 – Web Workers API,我们一起来看一看 Web Worker 是什么,怎么去使用它,在实际生产中如何去用它来进行产出。

    2020/03/26
  • Muuri菜鸟攻略_响应式,可排序,可过滤和可拖动的网格布局

    Muuri菜鸟攻略 官方网址:http://haltu.github.io/muuri/ GitHub:https://github.com/haltu/muuri 简介描述:响应…

    2020/03/06