Редукс-инструментарий общего состояния между редуктором - PullRequest
Новая
       14

Редукс-инструментарий общего состояния между редуктором

2 голосов
/ 21 апреля 2020

Я создаю небольшой калькулятор бюджета, и я впервые использую redux-toolkit, проблема в том, как разделить / передать состояние между редукторами в redux-toolkit? (как можно использовать totalIncomes и totalExpenses в срезе баланса для вычисления общего баланса?

другой вопрос - это нормально использовать вместо редуктора

доход редуктор-инструментарий. js: 

const incomesSlice = createSlice({
  name: "incomes",
  initialState: {
    list: [],
    loading: false,
    totalIncomes: 0,
    lastFetch: null,
  },
  reducers: {
    ADD_INCOME: (state, action) => {
      state.list.push({
        id: uuidv4(),
        description: action.payload.description,
        amount: action.payload.amount,
      });
    },
    REMOVE_INCOME: (state, action) => {
      const index = state.list.findIndex(
        (income) => income.id === action.payload.id
      );
      state.list.splice(index, 1);
    },
    TOTAL_INCOMES: (state, action) => {
      state.totalIncomes = state.list.reduce(
        (acc, curr) => acc + curr.amount,
        0
      );
    },
  },
});

расходы. js: 

const expensesSlice = createSlice({
  name: "expenses",
  initialState: {
    list: [],
    loading: false,
    totalExpenses: 0,
    lastFetch: null,
  },
  reducers: {
    ADD_EXPENSE: (state, action) => {
      state.list.push({
        id: uuidv4(),
        description: action.payload.description,
        amount: action.payload.amount,
      });
    },
    REMOVE_EXPENSE: (state, action) => {
      const index = state.list.findIndex(
        (expense) => expense.id === action.payload.id
      );
      state.list.splice(index, 1);
    },
    TOTAL_EXPENSES: (state, action) => {
      state.totalExpenses = state.list.reduce(
        (acc, curr) => acc + curr.amount,
        0
      );
    },
  },
});

export const {
  ADD_EXPENSE,
  REMOVE_EXPENSE,
  TOTAL_EXPENSES,
} = expensesSlice.actions;
export default expensesSlice.reducer;

сальдо. js: 

const balanceSlice = createSlice({
  name: "balance",
  initialState: {
    total: 0
  },
  reducers: {
    CALC_TOTAL: (state, action) => {
      // How to Calculate this ?
    },
  },
});enter code here

export const { CALC_TOTAL } = balanceSlice.actions;
export default balanceSlice.reducer;

1 Ответ

0 голосов
/ 21 апреля 2020

Можно ли использовать редукс-инструментарий вместо простого редукса

ДА . Первоначально он был создан, чтобы помочь решить общие проблемы с Redux. См. Его цель .

Как разделить / передать состояние между редукторами в redux-toolkit?

  1. Можно передать используемое состояние части к action.payload. 
dispatch(CALC_TOTAL(totalIncomes,totalExpenses))

Вы можете использовать extraReducers и "прислушиваться" к изменениям ваших доходов / расходов.

Вы можете создать промежуточное программное обеспечение или использовать createAsyncThunk, где вы можете ссылаться самое последнее состояние с getState().

...