Как заставить компонент React повторно отображать при сортировке массива внутри объекта состояния redux

#reactjs #redux #react-redux

#reactjs #сокращение #react-redux

Вопрос:

У меня есть приложение react, которое использует redux для управления состоянием. объект состояния имеет несколько свойств, одним из которых является массив. Когда я сортирую массив внутри объекта состояния, компонент не выполняет повторную визуализацию. Ниже приведен пример кода: modifiedState — это мой объект состояния redux, где allGroups — это массив

  let arry=modifiedState.allGroups;
 const newarry=arry.sort()
 modifiedState1={ ...modifiedState, allGroups: [ ...newarry ]};
 return modifiedState1;
 

Может кто-нибудь, пожалуйста, указать, что я делаю не так. Я создаю новый объект с помощью оператора spread, который принимает объект и обновляет массив отсортированным.

Ответ №1:

Если вам нужна только отсортированная версия вашего массива, я предлагаю перенести эту логику в ваш метод mapStateToProps.

Комментарии:

1. Не могли бы вы предоставить более подробную информацию о том, как это сделать? Я новичок в React-Redux. В основном в моем приложении пользователь может сортировать столбцы на странице с заголовком, таким как поле имени, описание, статус и т.д. Я хочу знать, редактирует ли пользователь некоторые данные col. Они все равно должны видеть новые данные в порядке сортировки так же, как и раньше. В настоящее время происходит то, что, как только пользователь редактирует некоторые данные, порядок сортировки теряется, поскольку мы не сохраняем ключ сортировки в состоянии redux. Можете ли вы, пожалуйста, предложить лучший способ сделать это в Redux?

2. Я был бы рад показать вам способ добиться этого, но мне нужна еще пара сведений о вашей существующей кодовой базе. Не могли бы вы, пожалуйста, показать мне свой метод вызова api, а также ваши действия и редуктор для этой части, пожалуйста? Кроме того, знакомы ли вы с крючками и функциональными компонентами? Если нет, это прекрасно, но мне нужно знать, чтобы дать максимально ясный ответ, поскольку вы боретесь с redux, я не хочу перегружать вас ненужной логикой. Компонент, содержащий уже предоставленный вами фрагмент кода, также поможет, но не является обязательным.