Mesa de Ayuda

2024-02-23.txt

Typescript:

nodo html --> button

evento --> onClick

codigo:
<button onClick={decreaseBy(1)}>+1</button>

error:
Type 'void' is not assignable to type 'MouseEventHandler<HTMLButtonElement> | undefined'.ts(2322)
index.d.ts(2380, 9): The expected type comes from property 'onClick' which is declared here on type 'DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>'

Solución:
Debemos colocar una funcion anónima antes que se llame al callBack.
<button onClick={()=>increaseBy(1)}>+1</button>

##########################################################

2024-02-27.txt

React

error:
"ERR_INSUFFICIENT_RESOURCES"
"AxiosError"
Las solcitudes fuern lanzadas en Bucle y no paraban.

Solución:
Utilizar el efecto secundario useEffect para llamar a mostrarProducto() solo una vez,
cuando el componente se monte por primera vez.
Con este cambio, mostrarProducto() se ejecutará solo una vez, cuando el componente se
monte por primera vez. Esto debería evitar que se produzca un bucle de solicitudes. Además,
he movido la llamada a setProduct dentro del bloque try-catch para manejar adecuadamente
cualquier error que pueda ocurrir al obtener el producto.

React:

Error:
React Hook useEffect has a missing dependency: 'id'
Se produce porque estás utilizando la variable id dentro del efecto useEffect, pero no lo
has incluido en el array de dependencias del efecto. Esto puede causar problemas de inconsistencia
si id cambia entre renderizaciones y el efecto no se actualiza en consecuencia.

Solución:
Para solucionar este problema, simplemente agrega id al array de dependencias del efecto useEffect.
Sin embargo, dado que id probablemente no cambiará después de que el componente se haya montado
(ya que se obtiene a través de useParams()), puedes desactivar esta advertencia de ESLint para
este caso particular utilizando // eslint-disable-next-line react-hooks/exhaustive-deps, asegurándote
de que sea una excepción consciente y apropiada.

// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

Esto desactivará la advertencia para este caso específico, ya que sabemos que id no cambiará
después de que el componente se haya montado. Sin embargo, si en algún momento id se convierte
en una dependencia que puede cambiar, deberías incluirlo en el array de dependencias para asegurarte
de que el efecto se ejecute correctamente cuando id cambie.