随笔 - 135  文章 - 0  评论 - 2  阅读 - 18万

滚动到指定位置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//滚动到选中定位的位置
selectedRegion() {
  // 通过Id获取到对应的dom元素
  const node = document.getElementById(this.sertCurrnetKey)
 
  setTimeout(() => {
    if (node) {
      this.$nextTick(() => {
        // 通过scrollIntoView方法将对应的dom元素定位到可见区域 【block: 'center'】这个属性是在垂直方向居中显示
        node.scrollIntoView({
          behavior: 'smooth', // 平滑过渡 值有auto、instant,smooth,缓动动画(当前是慢速的)
          block: 'center',
        })
      })
    }
  }, 100)
},

  

1
2
3
4
5
6
7
8
9
10
11
12
// 滚动条滚到需要校验的位置
               setTimeout(() => {
                   const el = document.querySelector(
                       '.ant-form-item-has-error',
                   );
                   if (el) {
                       el.scrollIntoView({
                           behavior: 'smooth',
                           block: 'center',
                       });
                   }
               }, 100);

  

posted on   稳住别慌  阅读(99)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 地球OL攻略 —— 某应届生求职总结
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 提示词工程——AI应用必不可少的技术
· .NET周刊【3月第1期 2025-03-02】
历史上的今天:
2021-03-25 object.assign
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

点击右上角即可分享
微信分享提示