mi código es largo y repetitivo. Debería usar la función auxiliar para cortarlo y hacerlo más mantenible y legible. Soy un principiante de React y tengo una pregunta. ¿Debo hacer la mayor parte de esta lógica con funciones auxiliares en un archivo separado con acciones o dentro de un segmento?
componente:
const FilterItems: React.FC<FuncProps> = (props) => { const dispatch = useDispatch(); const onChangeHandler = (e: React.ChangeEvent<HTMLInputElement>) => { e.preventDefault(); const content = e.target.value; dispatch( recipeAction.setFilterType({ type: props.type, set: e.target.checked, content: content, }) ); }; redux slice: setFilterType(state, action: PayloadAction<FilterType>) { if (action.payload.type === typeOfFiltering.dishType) { const chosenType = action.payload.content; if (action.payload.set) { state.chosenRecipeTypes.push(chosenType); } if (!action.payload.set) { state.chosenRecipeTypes.filter( (recipeType) => recipeType !== chosenType ); } } if (action.payload.type === typeOfFiltering.dishLength) { const chosenType = action.payload.content; if (action.payload.set) { state.chosenRecipeLengths.push(chosenType); } if (!action.payload.set) { state.chosenRecipeLengths.filter( (recipeType) => recipeType !== chosenType ); } } },Si necesita alguna funcionalidad en algunos otros componentes, haga algunas funciones auxiliares y reutilícelas en un componente separado. Si lo usa solo en un lugar, entonces no necesita separar...
también intente usar el interruptor en lugar de si con el caso predeterminado en la parte inferior
y para mi se ve mejor si usas destructores en vez de esto
const chosenType = action.payload.content;