0

I'm beginner++ to React, and I encounter some issue with Hook useReducer.

I am fetching data from an API with a reducer (dataFetchReducer) with cases like this (FETCH_INIT, FETCH_SUCCESS, FETCH_FAILURE, default).

This reducer (FETCH_SUCCESS) returns the state:

return {
  ...state,
  isLoading: false,
  isError: false,
  data: action.payload
};

Plus, I initialized it:

const initialData = {
  isLoading: true,
  isError: false,
  data: [],
};

const [dataAPI, dispatch] = useReducer(dataReducer, initialData)

Now I want to use another reducer (I thought I should split reducer by action? - since I could use the dataFetchReducer for another component) to manipulate my state and avoid doing too much tasks.

To be precise this is a simple Todolist example. I fetched my todos, now I want to (reset, add, remove, markAsDone) and so on but using another reducer.

Am I doing right using another reducer (todoReducer) - if so, which const should I use since already declared const [data, dispatch] - something like const [todos, dispatchTodos] but I am basically manipulating the same data ?

Hope I've been as much clear as possible.

Thanks in advance :)

dinker
  • 1
  • 1
  • I think it's overkill to use another useReducer. I design my state management around entities, so for example todo is an entity so there must be one reducer to handle all the manipulation to todos. – rzwnahmd Apr 09 '20 at 14:02
  • Yes, you could do that, by naming the state and dispatch differently. But I also think that in this case, these actions are closely related so they could be handled in one reducer. – zord Apr 09 '20 at 15:26
  • Alright, thanks a lot for your answers then. I'll go with 1 reducer ;) – dinker Apr 09 '20 at 17:42

0 Answers0