Как сохранить стейт после последнего рендера?

Question

[Николай]

Добрый день! я пытаюсь получить размер div через это

const [widthDiv, setWidth] = useState(0);

useLayoutEffect(() => {
        setWidth(ref.current.offsetWidth);

    },[]);

 const [styleDescription, apiDescription] = useSpring(() => ({width: widthDiv}))

Но у меня выводятся 2 значения в консоли (0 и 300) и берется только первое.
Как мне поступить, что-бы бралось значение после последнего рендера?

Answer 1

[Alexandroppolus]

Непонятно, где у тебя console.log, но судя по всему, на рендере. Здесь получается два рендера. Первый с нулем, , второй после useLayoutEffect по причине изменения стейта. Второй рендер перезаписывает всё, что устарело после первого. Проблемы на первый взгляд нет.

Comments

[Николай]

проблема в том что хук который берет состояние 0 из стэйта которое появляется первее, а мне нужно чтобы бралось состояние второе

[Николай]

Второй рендер не переписывает все. стэйт widthDiv идет в анимацию, но в конечном итоге в хуке анимации widthDiv=0 а не 300

[Alexandroppolus]

Николай, вызывай apiDescription.start, только если widthDiv больше 0.

[Николай]

Alexandroppolus, я пробовал прописать условие но оно либо крашается либо остается 0

[Николай]

Все я разобрался, использовал apiDescription в useEffect при обновлении widthDiv