Невозможно получить правильный clientWidth или clientHeight с помощью ref ref

Question

constructor(props) {
    super(props)
    this.ref = React.createRef()
}

componentDidMount() {
    const { clientWidth, clientHeight } = this.ref.current
    console.log(this.ref.current)
    console.log(clientWidth, clientHeight)
}

render() {
    return (
        <div ref={this.ref} style={{width: '100%', height: '100%'}}></div>
    )
}

Я хочу получить ширину и высоту элемента

Первый журнал содержит правильные значения

Но второй журнал говорит по-другому

Почему?

первый журнал:

clientHeight:783
clientLeft:0
clientTop:0
clientWidth:1385

второй журнал:

1920 248

Answer 1

Спасибо Нубинуб и Doğancan Arabacı

Я новичок в javascript и не совсем понятно со всей ссылкой

Теперь я понял, что журнал консоли Chrome иногда очень медленный, к моменту регистрации ширина и высота уже изменились.