Soy nuevo en React y estoy usando v17 con redux y me pregunto acerca de las mejores prácticas.
Estoy implementando un modo oscuro/claro que afecta a muchos componentes y estoy usando el estado de la tienda para guardar el tema actual con colores para usar:
import { createSlice } from "@reduxjs/toolkit"; const darkMode = { darkMode: true, backgroundColor: "#1e272e", textColor1: "#d2dae2", textColor2: "#d2dae2" }; const lightMode = { darkMode: false, backgroundColor: "#ecf0f1", textColor1: "#1e272e", textColor2: "#1e272e" }; export const themeSlice = createSlice({ name: "theme", initialState: { value: darkMode }, reducers: { enableDarkMode: (state, action) => { state.value = darkMode; }, enableLightMode: (state, action) => { state.value = lightMode; } } }); export const { enableDarkMode, enableLightMode } = themeSlice.actions; export default themeSlice.reducer; Uso el tema en componentes llamando a const theme = useSelector((state) => state.theme.value); en el componente principal y pasándolo como accesorios a los componentes secundarios.
Mi pregunta es la forma "correcta"? Empecé a leer sobre contexte y me pregunto si es más apropiado usarlo en lugar de state. ¿También debo llamar a useSelector en el componente principal y pasar los valores como accesorios a los componentes secundarios o debo usar useSelector en cada elemento secundario que necesite acceder a una parte del estado?
Gracias.
si usa redux, el estado en la tienda es global, por lo que puede llamarlo en cualquier hijo o padre para que no esté obligado a llamarlo en el padre y pasarlo por accesorios. accesorios: si tiene un estado en el componente principal y lo necesita solo en un componente secundario, páselo con accesorios
si el estado lo necesita en varios componentes que son difíciles o imposibles de pasar por accesorios, use redux o context api o cualquier administrador de estado global