Estoy pasando un accesorio necesario para ejecutar una llamada API en mi componente y no quiero que se ejecute en la representación inicial, sino solo una vez que este accesorio haya sido actualizado mediante el envío de un formulario. Aunque estoy poniendo accesorios en el argumento de dependencia, todavía ejecuta la llamada en el montaje. ¿Cómo puedo evitar que useEffect se ejecute automáticamente en el renderizado inicial? ¿Tal vez hay un método completamente diferente que debería considerar?
function GetData(props) { const [propsState, propsSetState] = useState(''); useEffect(() => { // Run API Call }, [props]) }const [mounted, setMounted] = useState(false); useEffect(() => { if (!mounted) { setMounted(true); return; } // Run API Call }, [props])const ref = useRef(); useEffect(() => { if (!ref.current) { ref.current = true return; } // Run API Call }, [props])En su declaración de devolución, use && lógico para evaluar si algo se actualiza antes de ejecutar la API en su componente.
{propState && <*YourComponent* />}Primero obtenga los datos, una vez que se están recuperando los datos, luego actualice el estado en su const[], una vez que tenga el valor, su componente luego renderiza la salida.