vue3中右侧26个英文字母排列，点击字母，平滑到响应内容

效果图如下：

 右侧悬浮

    

      

        {{item.first_char}}
      
    

左侧内容用id绑定

          
            
              

                

                
{{ itm.car_name }}
              
            
          
        

js代码

const activeIndex = ref(0)
const changeActive = (index) => {
  activeIndex.value = index

  let CardId = document.querySelector('#card-' + index)
  //使用平滑属性
  window.scrollTo({
    'top': CardId.offsetTop - 70,
    'behavior': 'smooth'
  })
}

第二种方法是用vue3的ref。