Как создать Redux Store для списка, который поддерживает состояние выбора

Question

Мои компоненты

'List'
'ListItem' (shows item selected or not)

Предполагается иметь следующую структуру для хранилища

store : {
 entities : {
   orders : []
 },
 selectedOrders : [ orderId1, orderId2 ]
}

Таким образом, каждый раз, когда отправляется действие ListItem компонент должен проверить, если его Идентификатор присутствует в selectedOrders и затем отображает соответствующее состояние выбора, не плохо ли это для повторения производительности каждый раз selectedOrders ?

Answer 1

Я думаю, что нет ничего плохого в итерации по массиву. Особенно если он не особо большой. Я думаю, что лучше оптимизировать для удобства чтения, чем прежде всего.

При этом вы можете использовать более эффективные структуры данных. Как объекты. Используйте идентификаторы в качестве ключей, а значения не имеют значения, если они правдивы. Например:

selectedOrders : { orderId1: true, orderId2: true }

И проверка выполняется быстро:

selectedOrders['orderId1']

Добавление и удаление ключей немного сложнее: Добавление:

selectedOrders: {...state.selectedOrders, [order]: true}

Удаление:

selectedOrders: state.selectedOrders.filter(o => o !== order)

Вы даже можете использовать Set, но я не знаю, поддерживается ли он, в частности, в состоянии Redux.

Answer 2

Предлагаю вам прочитать Официальная документация Redux

Answer 3

Ну, ты должен это сделать. Там нет трюк, который может помешать вам от этого. Как прокомментировал oshell, лучше поддерживать массив только с id. И используйте простую операцию, такую ​​как:

selectedOrder.includes(id); //true

или, если вы действительно хотите, чтобы объект был в вашем selectedOrder, тогда лучший способ:

selectedOrder.some(order => order.id === id); //true