2016-09-04 3 views
1

私は、店舗内で行われたすべての変更のために自分の店舗を更新する必要があるフォームを持っています。プロパティ/フィールドごとに20〜30の異なるアクションを行う必要はありませんが、プロパティ名と値を含む1つのアクションを作成することは良いアプローチになります。したがって、アクションは次のようになります。還元レデューサーでブラケット表記を使用

export function(property, value){ 
    return{ 
     type: UPDATE_MODEL, 
     property: property, 
     value: value 
    } 
} 

これを私のレデューサーに渡すと、私はブラケット記法を使ってみました。

case UPDATE_MODEL: { 
    return Object.assign({}, state, {[action.property]: action.value}); 
} 

は、これを行うとき:

dispatch(myAction("Type", {Id: 1})); 

私の減速がちょうど入ってくるオブジェクトにプロパティの種類を設定するのではなく、配列にTypeプロパティを設定します。これを適切に調整する方法はありますか?

現在の状態オブジェクトのlodashから_cloneDeepを使用しようとしましたが、変更したいブラケット表記を使用して、新しいオブジェクトでobject.assignを返しましたが、実際にはうまくいきません。

+0

function updateModel(state, action) { return Object.assign({}, state, { [action.property]: action.value }) } function updateModelAction(property, value) { return { type: 'UPDATE_MODEL', property, value } } function reducer(state, action) { switch (action.type) { case 'UPDATE_MODEL': return updateModel(state, action) default: return state } } console.log(reducer({}, updateModelAction('foo', { bar: 'baz' })))

ではなく、非常に複雑な –

+0

そのをReduxの形式を使用することを検討して、そして私は依存関係を最小化し、制御を維持するために可能な限り純粋かつ軽量行うことを好みます。私はredux形式を見ましたが、それはあまりにも多くのものは、私はあなたのやった変更は、新しい機能にobject.assignを抽出していた – thsorens

答えて

1

これはいかがですか?複雑な形のために

+0

そのコードはまったく同じです。しかし、あなたのスニペットを実行するときに私が見ることから、それは実際に私が期待しているものを返すということです。違いは何ですか? – thsorens

+0

私はこの回答を投稿した後に気づいた。あなたの 'myAction'関数はどのように見えますか? – nshoes

+0

myActionは私のコードサンプルの一番上にあるものです。 – thsorens

関連する問題