vue中使用锚点
一想到做锚点跳转,我都是用a标签加唯一id属性来实现跳转,但是这样有个弊端,vue的路由会在地址上带上id,当每次刷新页面的时候就会出现空白。所以只能通过js来控制跳转。<li><a href="javascript:void(0)" @click="goAnchor('About')">About</a></li>goAnchor(e) {var
·
一想到做锚点跳转,我都是用a标签加唯一id属性来实现跳转,但是这样有个弊端,vue的路由会在地址上带上id,当每次刷新页面的时候就会出现空白。所以只能通过js来控制跳转。
<li>
<a href="javascript:void(0)" @click="goAnchor('About')">About</a>
</li>
goAnchor(e) {
var id = "#" + e;
document.querySelector(id).scrollIntoView({
behavior: "smooth",
block: "center",
inline: "nearest",
});
},
使用 scrollIntoView还能加上跳转的动画,实测很好用。
更多推荐
已为社区贡献2条内容
所有评论(0)