JS不変更新深い構造

Question

私は私の構造を更新しようとしている「無効なキーパス」というエラーを取得しています：

state = fromJS({ 
    cmsData: { 
    "pages": [ 
     { 
     "name": "page1", 
     "content": { 
      "header": "Example header", 
      "intro": "Example intro", 
      "body": "Example body", 
     } 
     } 
     ... 
} 

私はこの使用して、ページの配列の値を更新しようとしている：

を

state.setIn(['cmsData', 'pages', index, 'content', title], value) 

indexは数字で、タイトルは文字列で、値も文字列です。

私は実行して代わりに新しいアイテムを作成することができます。

state.setIn(['pages', index, 'content', title], value) 

しかし、すぐに私はメインの「cmsData」オブジェクトにアクセスしようとして、私はエラーを取得します。

------ ------ UPDATE

私はオブジェクトを持っている場合は、私が最初にcmsDataオブジェクトを設定していなく、それが初期状態

state.set('cmsData', data) 

ています初期状態として、正常に動作します。しかし、それが設定されています後に更新しようとすると、無効なキーパスに

を生成----- ----- SOLUTION

代わりに初期データを設定する、私が働いていたmergeDeepを使用！

state.mergeDeep({ 'cmsData': data }) 

Answer 1

再度確認してください。私はあなたのコードを試して、それは正常に動作しているようだ。

var state = Immutable.fromJS({ 
    cmsData: { 
    "pages": [ 
     { 
     "name": "page1", 
     "content": { 
      "header": "Example header", 
      "intro": "Example intro", 
      "body": "Example body", 
     } 
    } 
    ] 
}}); 

私はこのステートメントを実行したところ、予想されるオブジェクトが返されました。ここで

は、新しいアイテムの作成SETINがcmsDataレベルをElideのようだlink to jsbin

Answer 2

です。なぜそれが他のアクセスに影響するのか分かりませんが、あなたが思ったことを作成していない可能性があります。そのキーパスにアイテムが存在しない場合（つまりcmsData内に）エラーが発生します。

Answer 3

初期データ、私は働いたmergeDeepを使用！

state.mergeDeep({ 'cmsData': data })