Comment organiser des objets à l'intérieur de redux avec Immutablejs et lire en réaction native à utiliser dans flatlist

Question

Je suis nouveau à réagir natif & redux, j'ai beaucoup expérimenté et j'ai presque une application de travail. J'ai une question sur la façon d'organiser les données à l'intérieur de redux ce qui aiderait les performances lors de l'analyse avec Listview/Flatlist dans réagissent natif.

Voici la structure des données que je reçois de mon API.

const data = { 
     "abcd1": { 
      "id":"abcd1", 
      "title": "test", 
      "contentOrder": 2 
     }, 
     "abcd2": { 
      "id":"abcd2", 
      "title": "test2", 
      "contentOrder": 1 
     } 
    } 

Convertir Immutablemap

const sortedMap = new Immutable.OrderedMap(data).sortBy((item) => item.contentOrder) 

Réducteur fusion

case ActionTypes.FETCH_SECTION.SUCCESS: 
    return state.merge({ 
     isFetching: false, 
     result: action.response, 
     error: "" 
    }) 

Je change cela à un immutablemap en utilisant Immutablejs et pousser à stocker Redux. Maintenant, quand je veux lire les articles de l'état pour l'affichage dans Flatlist ou ListView, la seule option que je vois est de créer un tableau avec tous les éléments comme

let newsItem = [] 
    state.get("data").valueSeq().forEach((val, index) => { 
     newsItem.push(val) 
    }); 

    and use it like this inside the component 

    <FlatList 
     data={newsItem} 
     keyExtractor={(item, index) => item.id} 
     renderItem={this._renderRow} 
    /> 

Alors ma question, est-ce une bonne pratique? ou y a-t-il une meilleure implémentation qui me manque?

Je dois aussi ajouter le défilement infini, pour cela, j'ai l'intention d'appeler mon action « onEndReached » pour fusionner le magasin avec les nouvelles données de api.

Je veux mettre en œuvre ce de manière appropriée pour éviter tout goulot d'étranglement, donc s'il vous plaît conseiller.

Merci pour votre conseiller & aide

Answer 1

réduire Généralement, le temps de calcul est fait en essayant d'éliminer tout à fait le calcul.

Ceci est souvent fait par une bibliothèque comme reselect qui vous aide à stocker l'état minimum à l'intérieur du magasin de redux. Ce sont les deux premières lignes d'introduction de la page GitHub:

Selectors peut calculer les données dérivées, ce qui permet de stocker Redux l'état minimal possible . Les sélecteurs sont efficaces. Un sélecteur n'est pas recalculé sauf si l'un de ses arguments change.