vue项目中关于锚点的(带变量)使用方法(全局使用)

问题

在普通html中,锚点的使用方法是:

<a href="#123">点击就定位到123的锚点</a>
...
<div id="123">这里是锚点的位置</div>

但在vue项目中,各个页面被划分成了很多组件,经常是在 A 组件中循环渲染多个 a标签,点击跳转到 B 组件的锚点位置

解决

在 A 组件中,

<a v-for="item in 20" :href="'#' + item">链接</a>
这里使用 v-bind:href ,才能使用变量 item,简写就是 :href
渲染结果就是:
<a href="#1">链接</a>
<a href="#2">链接</a>
...

在 B 组件中,

<div v-for="item in 20" :id="item">锚点</div>
这里使用 v-bind:id 才可以使用变量 item
渲染结果就是
<div id="1">锚点</div>
<div id="2">锚点</div>
...
全部评论

相关推荐

07-15 14:14
门头沟学院 Java
7.10投递7.15感谢信
投递地平线等公司7个岗位
点赞 评论 收藏
分享
LazyBreeze:项目尽量体现你对技术的理解和深度,不是说把中间件用一下就完事了,你项目里面提到集群和分布式,你真在服务器上部署过吗,感觉太假了,第二个项目说自己用了微服务的什么组件,只是用了没有自己的思考,很难让面试官注意到你的简历。针对某几个技术点自己多思考一下,考虑一下有没有别的替代方案,可以写一下,即使没有真的实现
点赞 评论 收藏
分享
鬼迹人途:你去投一投尚游游戏,服务器一面,第一个图算法,做完了给你一个策略题,你给出方案他就提出低概率问题,答不上当场给你挂
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务