Javascript 当我试图在react.js中获取图像的高度和宽度时，为什么返回undefined

我试图在react.js中将图像的高度和宽度值记录到控制台中，但它们（出于某种原因）未定义。你知道为什么吗

代码如下：

export default function FilmPage(props) {
    const getImgSize = (img) => {
        let imageEl = <img onLoad={()=>{
            console.log(imageEl.width)
            console.log(imageEl.height)
        }} src={img} />

        return imageEl
    }
    
    return (
        <div className="proper-film">
            <div className="body">
                <div>{getImgSize(props.data.image)}</div>
            </div>
        </div>
    )

}

顺便说一下，当我尝试调试时，我检索的数据没有问题

---

您有什么建议？

您可以修改

getImgSize

方法，如下所示

const getImgSize = (img) => {
    return <img onLoad={(e) => {
      console.log(e.target.offsetHeight)
      console.log(e.target.offsetWidth)
    }} src={img} />


  }

const getImgSize=（img）=>{
返回
}

---

imageEl

等于返回JSX代码，。您可以通过执行

获得此信息，并从e。但是，通常访问DOM元素时，您会使用

useRef

&

useffect

钩子。useffect（（）=>{…}，[]）您是否尝试将代码放入useffect钩子中？我很感激，这很有效it@EfeFRK.no问题。一起学习。：）

const getImgSize = (img) => {
    return <img onLoad={(e) => {
      console.log(e.target.offsetHeight)
      console.log(e.target.offsetWidth)
    }} src={img} />


  }