Quería crear un enlace similar a un servicio que no retenga el estado, solo exporta un objeto con funciones.
Primero comencé con esto:
export default useFoo = () => ({ // some functions here... });
Pero luego me di cuenta de que este no sería el mejor enfoque porque se creará un nuevo objeto cada vez que se llame al enlace y no quiero eso: necesito un objeto global con la misma referencia en todos los componentes, entonces entonces probé esto:
const foo = { // some functions here... }; export default useFoo = () => foo;
Funciona como se esperaba, pero no estoy seguro de si es la forma correcta de hacerlo. ¿Hay una mejor manera de lograr esto? ¿O debería usar el contexto tal vez?
EDITAR: sé que puedo exportar un objeto JS simple y no molestarme con los ganchos, pero necesito que sea un gancho porque uso otros ganchos adentro.
Funciona como se esperaba, pero no estoy seguro de si es la forma correcta de hacerlo. ¿Hay una mejor manera de lograr esto?
Si foo nunca cambia, y no necesita cerrar ningún valor de los otros ganchos que está llamando en useFoo
, entonces está bien. Si necesita cambiar en función de otros valores, puede usar useCallback
y/o useMemo
para recrear el objeto solo cuando cambien las cosas relevantes.
export default useFoo = () => { const something = useSomeHook(); const foo = useMemo(() => { return { /* some functions that use `something` */ } }, [something]); return foo; }