I have two different setStates in parent component
const [ isVisible, setIsVisible ] = useState(false);
const [ validImagePath, setValidImagePath ] = useState(null);
also has handle functions in parent
const handleVisibility = bool => setIsVisible(true);
const handleImagePath = path => setImagePath(path);
that parent has two child components
<Child1 handleVisibility={handleVisibility} isVisible={isVisible}/>
<Child2 validImagePath={validImagePath} handleVisibility={handleVisibility} isVisible={isVisible} />
When parent component is rendered then is visible and onClick it sets a state that it renders <Child 2/>. Everything works fine but I get this warning:
Warning: Cannot update a component (ForwardRef) while rendering a different component (Parent). To locate the bad setState() call inside Parent, follow the stack trace as described in https://reactjs.org/link/setstate-in-render.
Please help in resolving this warning.