【react hook】umi获取虚拟dom元素 并点击按钮滚动到对应元素位置
const onPosiScroll = (idx) => {
let labDom;
let getDom = (clssNm, i) => {
// 由于umi存在样式hash 因此不能直接通过样式字符串获取元素 需要从样式导入的styles变量里去获取指定className
return document.querySelectorAll(`.${styles[clssNm]}`)[i];
}
switch(idx) {
case 0: labDom = getDom('labelText', 1); break;
case 1: labDom = getDom('labelHead', 0); break;
case 2: labDom = getDom('labelHead', 1); break;
}
// console.log('dom===', labDom, labDom.clientHeight, labDom.clientTop, labDom.scrollHeight, labDom.scrollTop, labDom.offsetTop);
if (!labDom) return;
window.scrollTo({
top: labDom.offsetTop, // offsetTop获取当前元素相对于其父元素的左上角位置的左上角位置，也就是说 需要观察其父元素是否是最高级容器，如果不是可能需要追加其他父元素的高度
behavior: 'smooth',
});
};