情景:

  1.   比如在删除或者增加一条记录的时候希望当前页面可以重新刷新
  2.   请求接口中直接将数组结果取第0个数组或者第n个数组给变量,会报错 0 的错误,此时多次刷新即可

方法一、这种方法简单快捷,但是页面会有空白瞬间,体验不够好

this.$router.go(0);
location. reload()

    

    _getquery(){
getquery(
{product_id: this.product_id},
{Authorization: this.access_token}
).then( (res)=>{
if(res === undefined || res === ''){
this.reload(); // this.$router.go(0)
}else{
//请求到数据
this.product_content = res.answer[0].content.body;
}
})
    }

方法二、

  1. 在App.vue 文件中,router-view中加代码:v-if="isRouterAlive"

  

<template>
<div id="app">
<router-view v-if="isRouterAlive"/>
</div>
</template>

  2. 在App.vue文件中,在script中加入如下代码:

  

  

<script>
export default {
name: 'app',
provide (){
return {
reload: this.reload
}
},
data () {
return {
isRouterAlive : true
}
},
methods: {
reload () {
this.isRouterAlive = false;
this.$nextTick(function () {
this.isRouterAlive = true;
})
}
},
components: {
}
}
</script>

  3.在需要刷新的vue页面中 注入依赖 :inject: ['reload'],

  

  

  4.在需要刷新的vue页面中  调用 : this.reload();

   

    _getquery(){
getquery(
{product_id: this.product_id},
{Authorization: this.access_token}
).then( (res)=>{
if(res === undefined || res === ''){
this.reload(); // this.$router.go(0)
}else{
//请求到数据
this.product_content = res.answer[0].content.body;
}
})
    }

vue 刷新当前页面的更多相关文章

  1. URL不变的情况下,最实用的vue刷新当前页面,provide / inject 组合 方式实现vue页面刷新

    原文:https://blog.csdn.net/Dream_xun/article/details/83024487 其他参考:https://blog.csdn.net/liyunkun888/a ...

  2. Vue 刷新当前页面,并重新加载页面数据

    业务场景:在管理后台,在执行完,增,删,改,操作的时候.我们需要刷新一下页面,重载数据.在JQ中我们会用到location.reload()方法,刷新页面:在vue中,这里需要用到一个 provide ...

  3. vue刷新本页面

    顶层app.vue页面 <template> <div id="app"> <router-view v-if="isRouterAlive ...

  4. vue刷新子页面,跳到主页,params传参引起的血案!

    今天,算是真正认识了params传参,为什么说params传参引起了血案? 起因是这样的,我正在做一个登陆的模块,公司想根据url不同的参数来区分是什么类型的会议, 于是后端推荐我用params传参的 ...

  5. 解决:Vue刷新/载入页面,出现双括号闪现后消失

    https://cn.vuejs.org/v2/api/#v-cloak v-cloak 不需要表达式 用法: 这个指令保持在元素上直到关联实例结束编译.和 CSS 规则如 [v-cloak] { d ...

  6. vue项目如何刷新当前页面

    1.场景 在处理列表时,常常有删除一条数据或者新增数据之后需要重新刷新当前页面的需求. 2.遇到的问题 1. 用vue-router重新路由到当前页面,页面是不进行刷新的 2.采用window.rel ...

  7. vue刷新路由,不刷新页面

    1.路由介绍 vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来 ...

  8. 转:vue项目如何刷新当前页面

    想必大家在刨坑vue的时候也遇到过下面情形:比如在删除或者增加一条记录的时候希望当前页面可以重新刷新或者如下面这种: 如果希望点击确定的时候,Dialog 对话框关闭的时候,当前http://loca ...

  9. Vue.js刷新当前页面

    Vue.js的路由跳转很强大,类似ajax的局部刷新,路由跳转时候页面是不刷新的,刷新当前页面的功能不建议用,但是有的时候确实需要刷新当前页面来实现某些需求,这个时候,我们有三 种方法可以实现. 第一 ...

随机推荐

  1. System.getProperty()获取系统的配置信息

    原文地址:http://www.jsjtt.com/java/Javajichu/105.html 此处记录备用. 1. 通过System.getProperty()可以获取系统的配置信息,Syste ...

  2. [原]openstack-kilo--issue(十一)Failed connect to 169.254.169.254:80; No route to host

    本博客已经添加"打赏"功能,"打赏"位置位于右边栏红色框中,感谢您赞助的咖啡. # curl http://169.254.169.254/latest/use ...

  3. jenkins实战(二):构建自由风格的maven项目

    本系列打算全面介绍jenkins的常规使用,这是第二篇,之前的文章在: jenkins实战(一):war安装及插件安装 一.新建项目 1.新建项目 此处我们打算新建自由风格项目,见下图. 值得注意的是 ...

  4. TensorFlow MNIST 问题解决

    TensorFlow MNIST 问题解决 一.数据集下载错误 错误:IOError: [Errno socket error] [Errno 101] Network is unreachable ...

  5. MySQL 之 表操作

    一 什么是表 表(TABLE) 是一种结构化的文件,可用来存储某种特定类型的数据.表中的一条记录有对应的标题,标题 称之为 表的字段. 二 创建表 1 2 3 4 5 CREATE TABLE 表名( ...

  6. 6.13 py网络编程

    tcp的十种状态 python使用原始套接字才可以做黑客攻击!!!!!伪造数据包!!!!!直接越过底层!socket这个东西是经过linux过滤过得! TTL  每经过一个路由器就减1 谁先调clos ...

  7. :eq

    匹配一个给定索引值的元素?只要在html页面每个元素都有索引值,相同的元素按html位置顺序从0开始往下排.给定索引值:给定一个html某个区域的元素的索引值,也是从0开始 不给区域就是从html从d ...

  8. DevOps平台的“精益创业”之路

    本文内容节选自第六届全球软件案例研究峰会,时任中国移动通信集团浙江有限公司罗琼老师,申健老师分享的<DevOps平台的“精益创业”之路>实录,重点分享:DevOps产品研发过程,对外实施敏 ...

  9. TOP100summit2017:网易测试总监钱蓓蕾——新时代测试正走向精英化、自动化、智能化

    壹佰案例:钱蓓蕾老师您好,很荣幸邀请到您成为第六届壹佰案例峰会测试专场的联席主席.您从事测试工作11年了,您觉得最近几年测试工作有什么趋势上的变化么? 钱蓓蕾:测试行业近几年变化挺大的,正逐渐向精英化 ...

  10. java虚拟机学习

    //20181129 ·Java虚拟机的内存分为三个部分:栈stack.堆heap.方法区method area----包含在“堆”里面,因为作用特殊所以单独列出来 ·栈的特点:     栈描述的是方 ...