"router-link"各种属性解释_关闭router的超链接效果

"router-link"属性

1.":to" 属性

相当于a标签中的"herf"属性，后面跟跳转链接所用

<router-link :to="/home">Home</router-link>
<!-- 渲染结果 -->
<a href="/home">Home</a>

2."replace" 属性

replace在routre-link标签中添加后，页面切换时不会留下历史记录

<router-link :to="/home" replace></router-link>

3."tag" 属性

具有tag属性的router-link会被渲染成相应的标签

<router-link :to="/home" tag="li">Home</router-link>
<!-- 渲染结果 -->
<li>Home</li>

此时页面的li同样会起到a链接跳转的结果，vue会自动为其绑定点击事件，并跳转页面

4."active-class" 属性

这个属性是设置激活链接时class属性，也就是当前页面所有与当前地址所匹配的的链接都会被添加class属性

<router-link :to="/home" active-class="u-link--Active">Home</router-link>

active-class 属性的默认值是 router-link-active ,所以如果没有设置，就会被渲染为这个class

可以在router.js里面设置

const router = new VueRouter({
  mode: 'hash',
  linkActiveClass: 'u-link--Active', // 这是链接激活时的class
5."exact" 属 性 
开启router-link的严格模式 
<router-link :to="/" exact>home</router-link> 
上面这个标签如果不加exact属性，则会在vue2.leenty.com/article页面下也会被匹配到，
 这却不是我们的本意,在加了这个属性后就会正确的匹配到vue2.leenty.com下 
原文：点击打开
</Link>
// 对象定位描述符 Object location descriptor.
<Link to={{ pathname: '/hello', query: { name: 'ryan' } }}>
 Hello
</Link>
// 函数返回定位描述符Function returning location d
1.后端路由：对于普通的网站，所有的超链接都是URL地址，所有的URL地址都对应服务器上对应的资源；
2.前端路由：对于单页面应用程序来说，主要通过URL中的hash(#号)来实现不同页面之间的切换，同时，hash有一个特点：HTTP请求中不会包含hash相关的内容；所以，单页面程序中的页面跳转主要用hash实现；
3.在单页面应用程序中，这种通过hash改变来切换页面的方式，称作前...
                                    router-link标签
在vue1.0版本中的仍然用a标签来实现链接跳转功能，但链接地址与html中不同，它是采用v-link属性来控制。但是在2.0版本中a标签就被替换成了rount-link属性，但是最终在页面上显示还是会被渲染成a标签。接下来将要详细的介绍该属性中的各个值的用法
router-link属性值详解
（1）":to" 属性值
这个属性值就相当于a标签中的"herf"属性，后面的内容为跳转链接的内容
```<router-link :to="http://www.gxl
可以发现 a 标签渲染成了 按钮。
2.replace属性
我们发现 你点击了router-link 标签 然后跳转切换视图的时候，他默认保留历史的 即可以前进/后退，那么证明默认用的是 pushState ,我们如果不想让他可以前进、后退...
                                    传统web应用，又叫做多页面web应用：核心是一个web站点由多个HTML页面组成，点击时完成页面的切换，因为是切换到新的HTML页面上，所以当前页面会全部刷新。整个网站只有一个HTM页面，点击时只是完成当前页面中的切换。属于页面局部刷新。单页应用程序 (SPA) 是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。浏览器一开始会加载必需的HTML、CSS和JavaScript，所有的操作都在这张页面上完成，都由JavaScript来控制。单页面的跳转。
1、 什么是路由？
路由是根据不同的URL来展示不同的内容或页面；
前端路由就是把不同路由对应的不同页面或内容的展示交给前端来做（真正实现前后端分离），以前都是通过服务器端来根据URL的不同返回不同的页面，那些页面在服务端都是实实在在存在的，而前端路由就是只有一个index，其余页面是根据组件等进行渲染的，虚拟页面。
2、前端路由的优缺点？
优点：用户体验好，不是每次都需要从服务器全部获取，快速展示给用户。
不利于SEO
使用浏览器的前进后退功能是会重新发
VUE：渐进式的基于MVVM设计模式的纯前端JS框架
渐进式：可以在项目中逐步使用VUE的功能，也可以和其它技术混搭
vs 全家桶：要使用就必须使用全套所有技术，且不能和其它技术混搭
MVVM设计模式：
纯前端：nodejs学的不好和vue无关
框架：已经是一个半成品的项目，封装了大量重复性劳动，人只要提供个性化定制即可
原生DOM vs jQuery函数库 vs VUE框架
原生DOM
步骤多，函数繁琐
jQuery函数库
步骤没少，每个函数都变的很简单
VUE框架
彻底简化了步骤，无需人工干预
import Vue from "vue"
import Router from "vue-router"
import Home from "../components/Home.vue"
//使用该插件
Vue.use(Router)
//创建一个路由实例
const routes = [
    //重定向设置默认路径
    path: '',