Redux: A melhor prática para lidar com entidades normalizadas?

Criado em 19 ago. 2015 · 3Comentários · Fonte: reduxjs/redux

No meu primeiro App com Redux, estou tentando manter minhas coleções normalizadas conforme recomendado. Desta forma, você só precisa alterar as Entidades em um lugar. (parece certo para mim)

No início, normalizei com sucesso meu Array de dados para um Array-like-Object of Entities com os id's como chaves

Então eu queria listar as entidades em uma View, então tive que analisá-la de volta para um Array. Além disso, se eu quiser filtrar minhas entidades, preciso do array real. Esta é realmente a abordagem certa?

Exemplo com re-selecionar:

    // As "id" for my images i use "uri"

    imageEntities = {
     uri1: {image...},
     uri2: {image...},
    ....
    }

    // Selectors:
    const imagesSelector = state => state.images;

    // parse the Array-like-Object to an Array
    const imagesArySelector = createSelector(
      [imagesSelector],
          images => {
            let ary = [];
            for (var key in images) {
              if (images.hasOwnProperty(key)) {
                ary.push(images[key]);
              }
             }
            return ary;
          }
     );

    // filter the Array to get only the new images
    export const newImagesSelector = createSelector(
      [imagesArySelector],
        images => images.filter(image => image.isNew)
     );

Esta é realmente a abordagem certa? (está funcionando bem, pelo que vejo até agora)

question

Fonte

ms88privat

Comentários muito úteis

Acho que pode ser feito de forma mais elegante.
Como eu faço isso:

import { createSelector } from 'reselect';

const providersSelector = state => state.entities.providers;
const subscribersSelector = state => state.entities.subscribers;

export const providersArraySelector = createSelector(
    [providersSelector],
    providers => Object.keys(providers).map(id => providers[id])
);

export const subscribersArraySelector = createSelector(
    [subscribersSelector],
    subscribers => Object.keys(subscribers).map(id => subscribers[id])
);

itsmepetrov em 20 ago. 2015

👍3 👎1

Todos 3 comentários

Acho que pode ser feito de forma mais elegante.
Como eu faço isso:

import { createSelector } from 'reselect';

const providersSelector = state => state.entities.providers;
const subscribersSelector = state => state.entities.subscribers;

export const providersArraySelector = createSelector(
    [providersSelector],
    providers => Object.keys(providers).map(id => providers[id])
);

export const subscribersArraySelector = createSelector(
    [subscribersSelector],
    subscribers => Object.keys(subscribers).map(id => subscribers[id])
);

itsmepetrov em 20 ago. 2015

👍3 👎1

@itsmepetrov parece muito melhor ... thx.

Portanto, em princípio, estou no caminho certo. Alguém mais?

ms88privat em 20 ago. 2015

Então eu queria listar as entidades em uma View, então tive que analisá-la de volta para um Array.

Você pode manter uma matriz de IDs quando for mais conveniente trabalhar com as matrizes. Você _precisa_ fazer isso para coisas como paginação. O exemplo real-world na pasta examples faz isso.