「vue」解决锚点定位,url变化问题 (滑动)

项目中遇到这样一个问题,本来是想通过锚点定位来实现快速定位的效果,但是发现一个问题(url变化了)

所以我的解决方案为:

  {{index}} 
 document.querySelector("a[name=index]").scrollIntoView(true);  

scrollIntoView() :
这个方法传入true作为参数,或者不传,那么窗口滚动之后会让调动元素的顶部和视窗顶部尽可能齐平
这个方法传入false作为参数,调用元素会尽可能全部出现在视口中(有可能的话,元素底部会与视口顶部齐平)不过顶部不一定齐平。
argument:
对象: { behavior: "smooth"} : 这个参数可以让你的滑动更加丝滑哦
scrollIntoView 官方文档:https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

  • css 中 scroll-behavior:smooth; 这个可以让你的滑动更加丝滑
  • scrollITo(x, y) 也可以处理滑动
    x: x轴的偏移量
    y: y轴的偏移量

你可能感兴趣的:(「vue」解决锚点定位,url变化问题 (滑动))