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>
...
全部评论

相关推荐

把球:这个听过,你加了就会发现是字节的hr
点赞 评论 收藏
分享
点赞 收藏 评论
分享
牛客网
牛客企业服务