router-link标签学习

1.指定跳转路由，to属性

<!--通过to来指定跳转路由-->
<router-link to="/home">Home</router-link><!-- 同上 -->
<router-link :to="{ path: 'home' }">Home</router-link><!--还可以带查询参数，变成/profile?ID=10-->
<router-link :to="{path:'/profile',query:{ID:10}}" tag="button"></router-link><!--在JS代码，等价于上面的效果this.$router.push({path:'/profile',query:{ID:10}
})
-->

2.更改router-link渲染标签，tag属性

默认情况下vue的router-link会渲染成a标签，有时我们可能想将router-link渲染成其他标签，这时我们就可以使用tag来指定渲染的标签了。

<!--通过tag来指定渲染标签-->
<router-link to="/home" tag="button"></router-link>

3.修改路径（replace形式），replace属性

<!--replace,将使用router.replace()方法更改路径，而非router.push()-->
<!--这将无法用history.back()回退到上一浏览的页面，不会留下 history 记录，是直接的更改形式-->
<router-link to="/home" replace>Home</router-link>

4.添加形式跳转路由，append属性

<!--假如当前页面为/home，点击后将变成/home/my-->
<router-link :to="{path:'my'}" append>Home</router-link>

5.获取to属性中附带的查询参数

在对应组件中，通过$route.querys获取传递的查询参数

this.$route.query.ID

router-link标签学习相关推荐

DEDECMS模板原理、模板标签学习
(转)DEDECMS模板原理.模板标签学习 - .Little Hann 本文,小瀚想和大家一起来学习一下DEDECMS中目前所使用的模板技术的原理: 什么是编译式模板.解释式模板,它们的区别是什么? ...
html里link使用方法,html的link标签怎么使用？
html的link标签怎么使用?link标签是放在与之间的,把link放入这对符号中间<>,写成这样,然后在link后面添加属性和属性对应的值, 新手同学看到这里估计一头雾水,别担心,如 ...
综述系列 | 多标签学习的新趋势
点击上方"小白学视觉",选择加"星标"或"置顶" 重磅干货,第一时间送达导读随着Deep learning领域的不断发展,我们面对的问题 ...
1，html常用标签学习
1.html常用标签学习: 1.1.<em>和<strong>标签主要是用来做强调用的,其中<em>是让文字变成斜体,而<strong>把文字进行加粗显 ...
9大数据集6大度量指标完胜，周志华等提出深度森林处理多标签学习
2019-11-25 11:01:57 选自arXiv 机器之心编译参与:路雪.一鸣近日,南大周志华等人首次提出使用深度森林方法解决多标签学习任务.该方法在 9 个基准数据集.6 个多标签度量指标上 ...
最新综述：多标签学习的新趋势
这里给大家带来一篇武大刘威威老师.南理工沈肖波老师和 UTS Ivor W. Tsang 老师合作的 2020 年多标签最新的 Survey,我也有幸参与其中,负责了一部分工作. 论文链接: http ...
[html] link标签的属性media有哪些值？都有什么作用？
[html] link标签的属性media有哪些值?都有什么作用? 根据w3c的介绍,media属性表示link的链接文档会应用于何种媒介(设备)上.用于为不同的媒介类型规定不同的样式.常用的值为sc ...
link标签引入.css文件（目的）：适配不同屏幕
link标签引入.css文件(目的):适配不同屏幕本文 · 参考博客:https://blog.csdn.net/nianzhi1202/article/details/52464078 附 · 参 ...
link标签的几个用法，帮助提高页面性能
写在前面本文首发于公众号:符合预期的CoyPan HTML 中****元素规定了外部资源与当前文档的关系.最常见的用法,是用来链接一个外部的样式表,比如: <link href="m ...

router-link标签学习

router-link标签学习

1.指定跳转路由，to属性

2.更改router-link渲染标签，tag属性

3.修改路径（replace形式），replace属性

4.添加形式跳转路由，append属性

5.获取to属性中附带的查询参数

router-link标签学习相关推荐

最新文章

热门文章