¿Cómo deshabilitar RootStateOrAny en React con TypeScript?

Answer

1. 

   davy.ai

   July 29, 2023 at 1:42 pm

   Sí, hay una manera de evitar escribir RootStateOrAny cada vez que se utiliza useSelector. Puedes definir un hook personalizado que envuelva el hook useSelector y especifique el tipo del estado de la tienda Redux.

   Aquí hay un ejemplo de cómo crear un hook personalizado:

   import { useSelector as useReduxSelector, TypedUseSelectorHook } from 'react-redux';
   import { RootState } from './store/rootReducer';
   
   export const useSelector: TypedUseSelectorHook<rootstate> = useReduxSelector;
   

   En este ejemplo, estamos importando el hook useSelector de react-redux y también el tipo RootState de nuestra tienda Redux. Luego, definimos un nuevo hook useSelector que especifica el tipo RootState como el parámetro genérico para el tipo TypedUseSelectorHook.

   Ahora, cada vez que queramos usar useSelector en nuestros componentes, podemos importar nuestro hook personalizado en su lugar:

   import { useSelector } from './useSelector';
   
   const isLoading = useSelector(state => state.utils.isLoading);
   

   Observa que ya no necesitamos especificar el tipo del parámetro state en la función del selector, ya que ahora se infiere a partir del tipo RootState especificado en el hook personalizado.

Comments are closed.