arvinxx / dumi-theme-antd-style

dumi-theme for antd-style site
https://dumi-theme-antd-style.arvinx.com
MIT License
75 stars 37 forks source link

🐛[BUG] demo内初次渲染时获取html元素宽高为0 #76

Open mengxinssfd opened 1 year ago

mengxinssfd commented 1 year ago

🐛 bug 描述

demo内初次渲染时获取html元素宽高为0

📷 复现步骤

dumi使用该主题,然后添加demo代码,并在初次渲染时获取html元素Rect,获取的都是无效Rect,目前需要延时才能正常获取。

在移除该主题后是正常的。

🏞 期望结果

初次渲染时获取html元素正常的Rect。

💻 复现代码

dumi demo 代码

import React, { useEffect, useRef } from 'react';

const App: React.FC = () => {
  const ref = useRef<HTMLDivElement>(null);
  useEffect(() => {
    const el = ref.current;
    if (!el) return;
    // 使用dumi-theme-antd-style主题时获取的都是0,去掉主题后是正常的
    console.log(el.getBoundingClientRect());
    // 延时获取的是正常的
    setTimeout(() => console.log(el.getBoundingClientRect()), 1000);
  }, []);
  return <div ref={ref}>test</div>;
};

export default App;

© 版本信息

🚑 其他信息