vue-router 如何在当前路由下重新点击当前路由的router-link实现刷新

代码:

<router-link  to="/home" @click.native="flushCom">首页</router-link>

export default {

  ...

  ...

  methods:{
    flushCom:function(){

      //router是路由实例,例如:var router = new Router({})history

      //router.go(n)是路由的一个方法,意思是在history记录中前进或者后退多少步,0就表示还是当前,类似window.history.go(n)

      this.$router.go(0);

    }
  }
}

@click.native:事件后面要添加.native,不然添加的事件不起作用,具体原因应该是router-link为了阻止a标签的默认跳转事件

  

时间: 2024-10-11 07:04:18

vue-router 如何在当前路由下重新点击当前路由的router-link实现刷新的相关文章

vue.js路由vue-router(一)——简单路由基础

前言 vue.js除了拥有组件开发体系之外,还有自己的路由vue-router.在没有使用路由之前,我们页面的跳转要么是后台进行管控,要么是用a标签写链接.使用vue-router后,我们可以自己定义组件路由之间的跳转,还可以设置稍复杂的嵌套路由,创建真正的spa(单页面应用).我之前用vue-cli脚手架写了一个简单的人员管理实例,现在我们不用脚手架,就用原生的vue来写,本文也主要是通过实例来讲解vue.js+vue-router相关知识. 简单路由跳转实例 1.起步 下载vue-route

前端Vue框架 04 路由:逻辑跳转、路由传参 项目组件的数据局部化处理data(){ return{} } 组件的声明周期 组件间通信 各种第三方插件(vuex,axios,element-ui,(jq+bs))

项目初始化 """ 1)根组件:App.vue <template> <div id="app"> <router-view /> </div> </template> 2)路由配置:router/index.js const routes = [ { path: '/', name: 'Home', component: Home } ]; 3)组件:views和components文件夹 i)

vue动态添加路由addRoutes之不能将动态路由存入缓存

在我不知道vue的路由还可以通过addRoutes动态添加时,我只知道vue的路由都是写死在路由表中的,每当跳转时再去加载相应的路由.直到在一个新公司接到需要根据用户的权限显示不同的菜单的需求时才知道了原来vue-router还有一个addRoutes的API,立马研究了一下. router.addRoutes: 函数签名: router.addRoutes(routes: Array<RouteConfig>) 动态添加更多的路由规则.参数必须是一个符合routes选项要求的数组. 点这里去

2种方式解决vue路由跳转未匹配相应路由避免出现空白页面或者指定404页面

https://www.cnblogs.com/goloving/p/9254084.html https://www.cnblogs.com/goloving/p/9254084.html 1.路由全局守卫 在做项目的时候,遇到需要做路由跳转,但当用户输入错误url地址,或是其它非法url路由地址,我们或许会想到跳转至404页面.不管你有没有写一个404页面,当出现未匹配路由都需重新指定页面跳转.可能大家首先想到会是路由重定向,redirect来解决这个问题.但实际上通过redirect是没办

Vue配置路由和传参方式及路由守卫!

安装路由 npm i vue-router -S 引入路由 import VueRouter form VueRouter 注入路由模块 Vue.use(VueRouter) 定义路由匹配规则 let routes = [ {...}, {...} ] 上列匹配规则中 对象有如下属性 path : 路由路径 component : 所加载的组件 name : 别名 redirect : 重定向 children : 子级路由 创建路由实例 let router = new VueRouter({

vue之better-scroll的封装,包含下拉刷新,上拉加载功能及UI(核心为借鉴,我仅仅是给轮子套上了外胎...)

先发原文作者.地址等信息.我把内容全部搬过来了,也可以去看原文.内容绝对是满满的干货,给原作者点赞!(我添加的内容在转载过来的后面,内容不多) 作者: ustbhuangyi 链接:http://www.imooc.com/article/18232 来源:慕课网 在我们日常的移动端项目开发中,处理滚动列表是再常见不过的需求了,以滴滴为例,可以是这样竖向滚动的列表,如图所示: 也可以是横向滚动的导航栏,如图所示: 可以打开"微信 -> 钱包->滴滴出行"体验效果. 我们在实

Linux3.5内核以后的路由下一跳缓存

在Linux3.5版本号(包括)之前.存在一个路由cache.这个路由cache的初衷是美好的,可是现实往往是令人遗憾的.下面是陈列得出的两个问题:1.面临针对hash算法的ddos问题(描写叙述该问题的文章已经汗牛充栋,不再赘述):2.缓存出口设备是p2p设备的路由项会降低性能.这些问题本质上是由于路由cache的查找方式和路由表的查找方式互不相容引起的.路由cache必须是精确的元组匹配,因此它必须设计成一维的hash表,而路由表查找算法是最前前缀匹配.因此它能够是多维的. 路由查找终于会找

Yaf中map路由下delimiter的问题

由于map路由下用户请求的url会按照"/"分级对应到controllers下的目录下的Controller上,action则默认为indexAction,所以想要实现/key1/param1/key2/param2这种形式进行传参,就要通过delimiter来讲url分割成req_uri和query_str两个部分. 在实践中,定义了delimiter(尽管并没有用到它的功能),这时,如果用户的请求(更多的是爬虫或扫站)无意中包含以下形式:/aaa/bbb[delimiter](xx

单臂路由下vlan互联

单臂路由器下实现多vlan之间的互相通信,2台电脑ip地址为192.168.10.1,192.168.20.1分别为vlan10.vlan20. Switch>enaSwitch#configure tSwitch(config)#vlan 10Switch(config-vlan)#vlan 20 Switch(config-vlan)#exit Switch(config)#interface fastEthernet 0/1Switch(config-if)#switchport acce