0

Стек: react, redux toolkit

Имеется следующая типизация глобал стейта:

export type TodoItem = {
  id: string;
  title: string;
  order: number;
  content: string;
  isChecked: boolean;
};

export type Board = {
  title: string;
  id: string;
  order: number;
  items: TodoItem[];
};

export type State = {
  boards: Board[];
  settings?: any;
};

Здесь важно заметить то, что массив todo находится в массиве boards. Полагаю во вложенности и заключается проблема. Я создал экшен который меняет местами (свойство order) todo на board'е. Пытаюсь начать сортировку, но она не работает. Код экшена ниже:

changeOrders: (state, action: PayloadAction<[currentTodo: TodoItem, eventTodo: TodoItem]>) => {
      const sortFunc = (a: TodoItem | Board, b: TodoItem | Board) => {
        return a.order - b.order;
      };
      state.boards.map((board) =>
        board.items
          .map((todo) => {
            if (todo.id === action.payload[0].id) {
              return { ...todo, order: action.payload[1].order };
            }
            if (todo.id === action.payload[1].id) {
              return { ...todo, order: action.payload[0].order };
            } else return todo;
          })
          .sort(sortFunc),
      );
    },

Ожидаемая реакция - стейт обновляется, сортируется, перерендеривается. У меня же - стейт не обновляется, стейт не сохраняет сортировку, не перерендеривается.

1
  • Почему вы думаете, что ничего не происходит? То что не обновляется стейт, не говорит о том, что сортировка не произошла.
    – SwaD
    29 дек 2022 в 8:11

1 ответ 1

1

Кажется проблема в том, что результат map() не используется. Т.к. вы используете Redux Toolkit, то вам вам стоит сделать state.boards = state.boards.map(...)

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.