React - rerender after content becomes visible

user_6772003 0
Viewed 47

I have a React (hooks) component inside an Accordion (<details> element).

The component makes some assumptions about offsetWidth for some child elements being available, but as the accordion is closed, the component is not visible and these Refs have an offsetWidth of 0.

I need to re-render the component, after the accordion is open and the component itself becomes visible.

I am trying passing the state of the accordion (open/closed) down to the component to trigger a render when this changes, but useEffect is run before the browser draws the component, so width is still 0 even if accordion state is open.

Any idea how to solve this?

react-hooks reactjs
1 Answers

Well actually useEffect is called after the component re-render. So that is probably not your problem.

I suggest using the state for dynamically adding a class with display: none and removing it. instead of changing its width to zero

user_72323120
Related