2017-04-12 9 views
0

私は現在、react-reduxとImmutable.jsを使用しています。私はちょうど私の店の各フィールドが不変型であることに気づいた。しかし、私がconsole.logにストアすると、実際には値が不変型のオブジェクトになります。ストア自体は、まだオブジェクトです。私のreduxストアはなぜ不変ではありませんか?

は、私はその後、私は実際に、初期状態として、空のオブジェクトを取る私の店を、作成するためにconfigStoreを呼び出して、私はなどのミドルウェア、デベロッパーツールを追加するcomposeを使用configStoreというカスタム関数を作成します。

Object { 
    keyA: Map(), 
    keyB: OrderedMap(), 
    ... 
} 

これは私がセレクタはストア内のデータを取得するために全体の状態で取る私のアプリ、全体で何をしてきたと矛盾ようだ:私は私の店をCONSOLE.LOGとき、私はこのような何かを得ます。たとえば、私は(state) => state.keyA.getIn(nestedKey, furtherNestedKey)のような何かをします。 getIn()はImmutableJS APIです。

これは私を心配しているいくつかの質問に私をリード:

  • state場合、私はどのようにそれと対話することができ、不変、店をCONSOLE.LOG際に示したように、オブジェクトが、でしたか?

  • ImmutableとReact-reduxを使用する目的を克服して、不変でないストア(不変のデータ型を含む)を持っていますか?不変

+0

このコードスニペット( 'state.keyA.getIn ...')は、不変が**外部のオブジェクトと対話していないことを意味します。 –

+0

'Immutable.js'は、JSオブジェクトを不変にする唯一の方法ではありません。また、 'combineReducers'でreduxがやっていると思う' freeze() 'を使うこともできます。しかし、immutablesを使うことは全く必要ありません。これはあなたのデータを変更することを防ぐためのヘルパーです。 – Sulthan

+0

@OliverCharlesworthああ。あなたは、絶対に正しい。しかし、いずれにも欠点はありますか?私の店が不変型のオブジェクトであるとは思われません。 – AlanH

答えて

0

のみ代わりにあなたには、いくつかにそのデータ構造を使用することができ、それが直接の状態と相互作用しないなどListMapSet、などのデータ構造の最も一般的なセットの不変のバージョンを提供オブジェクトのコレクションを格納するなど、状態のプロパティ。 Immutableを使用すると、状態を変更せずにこれらのデータ構造を操作できます。あなたは記事の配列を返すアクションを持っていると仮定すると、一例として、次のコードを取る:それはそれは簡単にデータ構造に変異を回避することができるよう不変の使用

import Immutable from 'immutable'; 

reducer = (state = { 
    articlesLoaded: false, 
    articles: Immutable.List(), 
}, action) => { 
    switch(action.type) { 
    case "GET_ARTICLES": 
     return { 
     ...state, 
     articlesLoaded: true, 
     articles: Immutable.List(action.articles) 
     }; 
    default: 
     return state; 
    } 
} 

目的は、純粋に便利です。もちろん、不変のデータ構造ではないストアを持つことができます。実際には、これが最も一般的な使用例です。オブジェクトの不変性はオブジェクト自体に依存するのではなく、オブジェクトを操作する方法(新しいものを作成する)であることに注意することが重要です。そのため、不変型を使用しながら状態を変更することもできますあなたが本当に物事を台無しにする場合。

Immutableですべての作業を行う必要がない場合には、変更不可能なデータ構造を使用するcombineReducersの変更バージョンがあります。したがって、状態全体をImmutable.Mapとして定義することができます。

関連する問題