vue组件重新加载(刷新)
vue组件重新加载(刷新)
第一种方法:利用v-if控制router-view,在根组件APP.vue中实现一个刷新方法
<template>
<router-view v-if="isRouterAlive"/>
</template>
<script>
export default {
data () {
return {
isRouterAlive: true
}
},
methods: {
reload () {
this.isRouterAlive = false
this.$nextTick(() => (this.isRouterAlive = true))
}
}
}
</script> 然后其它任何想刷新自己的路由页面,都可以这样:
this.reload()
这种方法可以实现任意组件的刷新。
第二种方法:路由替换
// replace another route (with different component or a dead route) at first
// 先进入一个空路由
vm.$router.replace({
path: '/_empty',
})
//then replace your route (with same component)
vm.$router.replace({
path: '/student/report',
query: {
'paperId':paperId
}
})
转载自:https://blog.csdn.net/weixin_40054326/article/details/79384433
vue组件重新加载(刷新)的更多相关文章
- 前端性能优化成神之路--vue组件懒加载(Vue Lazy Component )
---恢复内容开始--- 使用组件懒加载的原因 我们先来看看这样的一个页面,页面由大量模块组成,所有模块是同时进行加载,模块中图片内容较多,每个模块的依赖资源较多(包括js文件.接口文件.css文件等 ...
- vue组件懒加载
vue2组件懒加载浅析 一. 什么是懒加载 懒加载也叫延迟加载,即在需要的时候进行加载,随用随载. 二.为什么需要懒加载 在单页应用中,如果没有应用懒加载,运用webpack打包后的文件将会异常的大, ...
- Vue 组件异步加载(懒加载)
一.vue的编译模式 (1)路由配置信息 //eg1: const MSite = resolve => require.ensure([], () =>resolve(require([ ...
- vue组件懒加载(Load On Demand)
在Web应用程序中,系统的瓶颈常在于系统的响应速度.如果系统响应速度过慢,用户就会出现埋怨情绪,系统的价值也因此会大打折扣.因此,提高系统响应速度,是非常重要的. 懒加载(Load On Demand ...
- vue路由懒加载及组件懒加载
一.为什么要使用路由懒加载 为给客户更好的客户体验,首屏组件加载速度更快一些,解决白屏问题. 二.定义 懒加载简单来说就是延迟加载或按需加载,即在需要的时候的时候进行加载. 三.使用 常用的懒加载方式 ...
- Vue 路由&组件懒加载(按需加载)
当打包构建应用时,Javascript 包会变得非常大,影响页面加载速度.使用Vue路由懒加载和组件懒加载可以提升页面加载速度,减少白屏时间,提升用户体验. 用法有如下三种:(路由懒加载与组件懒加载用 ...
- vue第七单元(vue的单文件组件形式-单文件组件的加载原理-vue-cli构建的开发环境以及生命周期)
第七单元(vue的单文件组件形式-单文件组件的加载原理-vue-cli构建的开发环境以及生命周期) #课程目标 掌握安装 vue-cli 命令行工具的方法,掌握使用命令行在本地搭建开发环境,使用命令行 ...
- Vue按需加载提升用户体验
Vue官方文档异步组件: 在大型应用中,我们可能需要将应用拆分为多个小模块,按需从服务器下载.为了让事情更简单, Vue.js 允许将组件定义为一个工厂函数,动态地解析组件的定义.Vue.js 只在组 ...
- vue实现懒加载的几种方法
vue实现惰性加载是基于: 1.ES6的异步机制 components: { comp: (resolve, reject) => {} } 2. webpack的代码分割功能 require. ...
随机推荐
- Jmeter-ForEach控制器
ForEach Controller需要配合‘用户定义的变量’来使用,作用是参数化 名称:字面意思,ForEach Controller的名称 注释:字面意思 输入变量前缀:变量的前缀:如要使用的变量 ...
- win7如何安装maven、安装protoc
问题导读1.protoc安装需要安装哪些软件?2.如何验证maven是否安装成功?3.如何验证protoc是否安装成功 ? 一.安装mvaven包 1.首先我们下载maven包 apache-mave ...
- 剑指offer第五章
剑指offer第五章 1.数组中出现次数超过一半的数 数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字. 例如输入一个长度为9的数组{1,2,3,2,2,2,5,4,2}.由于数字2在数组 ...
- CnetOS7使用yum方式安装nginx
之前一直使用源码包安装,但是对于需要一直进行重新安装的测试环境来说安装起来还是过于麻烦了.今天搜索发现能够进行yum方式的安装,特此记录. 新建yum文件,yum源是nginx的官网. # vim / ...
- (转)GIL 与 Python 线程的纠葛
原文地址:http://zhuoqiang.me/python-thread-gil-and-ctypes.html 作者:Qiang GIL 与 Python 线程的纠葛 GIL 是什么?它对 py ...
- DispatcherServlet的初始化(二)
DispatcherServlet的初始化在springmvc的启动中有讲过,这一篇在上一篇的基础上接着讲.DispatcherServlet作为springmvc的前端控制器,还需要初始化其他的模块 ...
- 关于MySQL 通用查询日志和慢查询日志分析
MySQL中的日志包括:错误日志.二进制日志.通用查询日志.慢查询日志等等.这里主要介绍下比较常用的两个功能:通用查询日志和慢查询日志. 1)通用查询日志:记录建立的客户端连接和执行的语句. 2)慢查 ...
- cocos2dx调度器(scheduler)
调度器(scheduler) http://cn.cocos2d-x.org/article/index?type=cocos2d-x&url=/doc/cocos-docs-master/m ...
- LogStation 支持浏览器实时查看日志
我们在logback 分布式日志汇总中已经将日志输出到了all.logs,LogStation支持浏览器实时查看日志,适合研发和运维彼此独立的场景:研发没有服务器权限,却想看日志实时输出.再配合ngi ...
- FPGA之外,了解一下中断
中断是什么? 中断的汉语解释是半中间发生阻隔.停顿或故障而断开.那么,在计算机系统中,我们为什么需要“阻隔.停顿和断开”呢? 举个日常生活中的例子,比如说我正在厨房用煤气烧一壶水,这样就只能守在厨房里 ...