Redux: Meilleure pratique de gestion des entités normalisées?

Créé le 19 août 2015 · 3Commentaires · Source: reduxjs/redux

Dans ma première application avec Redux, j'essaie de garder mes collections normalisées comme recommandé. De cette façon, vous ne devez modifier les entités qu'à un seul endroit. (cela me semble juste)

Au début, j'ai normalisé avec succès mon tableau de données en un objet d'entités semblable à un tableau avec les identifiants comme clés

Ensuite, j'ai voulu lister les entités dans une vue, donc j'ai dû l'analyser en un tableau. Aussi, si je veux filtrer mes entités, j'ai besoin du vrai tableau. Est-ce vraiment la bonne approche?

Exemple avec re-sélection:

    // 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)
     );

Est-ce vraiment la bonne approche? (ça marche bien, de ce que je vois jusqu'à maintenant)

question

Source

ms88privat

Commentaire le plus utile

Je pense que cela peut être fait plus élégamment.
Comment je fais:

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 le 20 août 2015

👍3 👎1

Tous les 3 commentaires

Je pense que cela peut être fait plus élégamment.
Comment je fais:

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 le 20 août 2015

👍3 👎1

@itsmepetrov a l' air mieux ... merci.

Donc, en principe, je suis sur la bonne voie. Quelqu'un d'autre?

ms88privat le 20 août 2015

Ensuite, j'ai voulu lister les entités dans une vue, donc j'ai dû l'analyser en un tableau.

Vous pouvez conserver un tableau d'ID lorsque les tableaux sont plus pratiques à utiliser. Vous devrez le faire pour des choses comme la pagination. L'exemple real-world dans le dossier examples fait cela.