vue-router各个属性的作用及用法

原文:https://www.cnblogs.com/goloving/p/9211358.html

vue-router是vue单页面开发的路由,就是决定页面跳转的!

Props 属性

1、to

表示目标路由的链接。当被点击后,内部会立刻把to的值传到router-push()。

2、replace

设置replace属性的话,当点击时,会调用roter.replace()而不是router.push(),所以导航后不会留下history记录,也就是不能回退到上一个页面

3、append

设置append属性后,则在当前路径前添加基路径,例如,我们从/a导航到一个相对路径b,如果没有配置append,则路径为/b,如果配了,则为/a/b

4、tag

有时候想要

5、active-class

设置链接激活时使用的css类名。默认值可以通过路由的构造选项linkActiveClass来全局配置, 默认值为 ‘router-link-active’

6、exact

“是否激活”,默认是false 。举个粟子,如果当前的路径是/a 开头的,那么

按照这个规则,

7、events

声明可以用来触发导航的事件(默认是’click’)。可以是一个字符串或者是一个包含字符串的数组

8、将”激活时的css类名”应用在外层元素

有时候我们要让”激活的css类名”应用在外层元素,而不是

9、方法

router-link默认是触发router.push(location),如果设置的replace 则触发router.replace(location),这有啥区别呢?

router.push() :导航跑到不同的URL,这个方法会向history栈添加一个新的记录,所以,当用户点击浏览器后退按钮时,则回到之前的url.

router.replace(): 跟router.push作用是一样的,但是,它不会向history添加新记录,而是跟它的方法名一样替换掉当前的history记录.

router.go(n): 这个方法的参数是一个整数,意思是在history记录中向前或者后退多少步,类似window.history.Go(n)

Original: https://www.cnblogs.com/crazy-lc/p/15183033.html
Author: MyBeans
Title: vue-router各个属性的作用及用法

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/608448/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

  • 使用easyExcel注意事项

    404. 抱歉,您访问的资源不存在。 可能是网址有误,或者对应的内容被删除,或者处于私有状态。 代码改变世界,联系邮箱 contact@cnblogs.com 园子的商业化努力-困…

    Java 2023年6月5日
    089
  • feign调用spring clound eureka 注册中心服务

    @RestController public class TestService { private TestApi computeClient; private static f…

    Java 2023年5月29日
    088
  • 关于Java注释报错的一个问题

    做作业时发现一个问题,注释会报错主要代码如下: String str = "C:\\users\\Default.migrated"; str += &quot…

    Java 2023年6月6日
    082
  • Object.keys() 作用

    能便利 Key Object.keys() posted @2022-08-31 16:04 简单易懂 阅读(7 ) 评论() 编辑 Original: https://www.c…

    Java 2023年6月5日
    088
  • MySQL知识点1

    本文基于尚硅谷MySQL以及个人部分总结 基本的SELECT语句 SELECT * FROM employees; SELECT employee_id ,last_name ,s…

    Java 2023年6月6日
    077
  • Spring-cloud-alibaba-nacos(配置中心)快速入门(一)

    1、引入依赖 <dependency> <groupid>org.springframework.cloud</groupid> <art…

    Java 2023年6月5日
    070
  • 程序包org.springframework.boot不存在

    使用idea2020.2.2新版本发现新建的springboot项目起不来,报错信息如下: java: 程序包org.springframework.boot不存在java: 程序…

    Java 2023年5月30日
    0165
  • MongoDB

    最近一直在做数据接入相关的工作,刚好用到了MongoDb,下面就简单介绍下MongoDB连接及查询语法。 MongoDB 是一个高性能,开源,无模式的文档型数据库,开发语言是C++…

    Java 2023年6月13日
    065
  • nginx 反向代理

    nginx 反向代理 两边协议要一样,http的反向代理要http的 Original: https://www.cnblogs.com/agang-php/p/15687022….

    Java 2023年5月30日
    082
  • 这个简单的小功能,半年为我们产研团队省下213个小时

    大多数人对产研同学的认知都是每天做着高大上的活儿。 我们以为的产研团队是: 研发负责人:今年最新的技术架构是什么、我的团队适合吗? 开发同学:010001,一顿代码猛如虎 测试同学…

    Java 2023年6月8日
    093
  • docker+nginx+redis部署前后端分离项目!!!

    介绍本文用的经典的前后端分离开源项目、项目的拉取这些在另一篇博客!!! 其中所需要的前后端打包本篇就不做操作了!!不明白的去看另一篇博客!!! 地址:http://www.cnbl…

    Java 2023年6月9日
    0106
  • 【实战】利用多线程优化查询百万级数据

    前言 日常开发中,难免会遇到需要查询到数据库所有记录的业务场景,在索引完善的情况下,当数据量达到百万级别或者以上的时候,全表查询就需要耗费不少的时间,这时候我们可以从以下几个方向着…

    Java 2023年6月5日
    091
  • java

    一:在java语言,怎么理解goto。goto这个词是c语言中,goto语句通常与条件语句配合使用,可以来实现条件转移,构成循环,跳出循环等功能,而在结构化程序语言中一般不主张使用…

    Java 2023年6月5日
    079
  • java-抽象类笔记

    抽象方法 使用 abstract 修饰的方法, 没有方法体,只有声明。 定义的是一种”规范”, 就是告诉子类必须要给抽象方法提供具体的实现。 抽象类 包含 …

    Java 2023年6月15日
    060
  • 信管知识梳理(六)信息化发展与应用、信息系统规划和服务管理、首席信息官

    一、信息化发展与应用 1.1 信息化发展与应用的新特点 我国在”十三五”规划纲要中,将培育人工智能、移动智能终端、5G、先进传感器等作为新一代技术产业创新重…

    Java 2023年6月6日
    074
  • MongoDB高级应用之高可用方案实战(4)

    1、MongDB启动与关闭 1.1、命令行启动 ./mongod –fork –dbpath=/opt/mongodb/data —-logpath=/opt/mongod…

    Java 2023年6月7日
    086
亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球