mettre à jour un tableau imbriqué dans un objet d'une manière immuable

Question

donc je ce réducteur que je voudrais mettre à jour

import { fromJS } from 'immutable'; 
const initialState = fromJS({ 
    searchParams: { 
    limit: 100, 
    page: 1, 
    order_by: 'name', 
    filters: { 
     and_keywords : [] 
    } 
    }, 
}) 

lorsque l'action est déclenchée, je voudrais pousser un objet dans le tableau de and_keywords. Ce que je l'ai fait jusqu'à présent est ce

case ADD_KEYWORDS: 
return state 
    .setIn(['searchParams', 'filters', 'and_keywords'], '123'); 

J'ai aussi essayé

case ADD_KEYWORDS: 
return state 
    .updateIn(['searchParams', 'filters', 'and_keywords'], arr => arr.push('123')) 

fondant des documents https://facebook.github.io, mais je ne peux pas sembler le faire fonctionner. Aucun changement n'a été effectué après l'exécution de cette commande

Answer 1

Votre version updateIn devrait fonctionner:

const Immutable = require('immutable') 

const initialState = Immutable.fromJS({ 
    searchParams: { 
    limit: 100, 
    page: 1, 
    order_by: 'name', 
    filters: { 
     and_keywords : [] 
    } 
    }, 
}) 

const newState = initialState.updateIn(['searchParams', 'filters', 'and_keywords'], arr => arr.push('123')) 

console.log(newState) 

Votre setIn code de version devrait fonctionner aussi bien avec une petite modification:

const Immutable = require('immutable') 


const initialState = Immutable.fromJS({ 
    searchParams: { 
    limit: 100, 
    page: 1, 
    order_by: 'name', 
    filters: { 
     and_keywords : [] 
    } 
    }, 
}) 

const newState = initialState.setIn(['searchParams', 'filters', 'and_keywords'], initialState.getIn(['searchParams', 'filters', 'and_keywords']).push('123')) 

console.log(newState) 

Les deux devraient sortie:

Map { "searchParams": Map { "limit": 100, "page": 1, "order_by": "name", "filters": Map { "and_keywords": List [ "123" ] } } }