2017-06-11 7 views
0

私は私の店を更新するように私のアクションセットアップを持っている。私は本当にReduxのは、私のプロジェクトに追加するコードの量を楽しんでいない午前、react-reduxアクションコードを削減すると、これは悪い解決策ですか?

export const updateUser = (data) => { 
    return{ 
     type: 'UPDATE_USER', 
     payload: data 
    }; 
}; 

const initialState = { 
    email: null, 
    name: null 
}; 


export default function(state = initialState, action) { 
    switch(action.type) { 
     case 'UPDATE_USER': 
      return Object.assign({}, state, action.payload); 
      break; 
     default: return state; 
    } 
} 

updateUser({ email: 'new email', name: 'some guys name'}); 

は、この私の店を更新するために実行可能なソリューションである、または私は私の行動は、より具体的にする必要があります。

+0

'return'の直後に' break'は必要ありません。これは、コードの量を少し減らす必要があります:) –

答えて

1

還元アクションの基本的な定義は{ type: 'type', payload: 'payload' }なので、あなたのアクションクリエイターは大丈夫です。

あなたが実際にこのようなアクションの作成者、作成者が作成できます。

const actionsCreatorCreator = (type) => (payload) => ({ 
    type, 
    payload 
}); 

//and create many actions from it 

export const updateUser = actionsCreatorCreator('UPDATE_USER'); 
export const addUser = actionsCreatorCreator('ADD_USER'); 

ます。また、アクション、および減速を作成するためのメソッドを提供したアクション/減速ユーティリティライブラリを使用することができます。私は過去にredux-actionsを使用しました。

これは、私がアクション/レデューサーコードの量を減らすために採用した他の小さな最適化です。

- オブジェクトの残り/スプレッドが必要Babel's Object rest spread transform

export const updateUser = (payload) => ({ // return the object without a return statement 
    type: 'UPDATE_USER', 
    payload // shorthand property name 
}); 

const initialState = { 
    email: null, 
    name: null 
};  

export default function(state = initialState, { type, payload }) { // destructure the action 
    switch(type) { 
     case 'UPDATE_USER': 
      return { ...state, ...payload } // use object rest/spread instead of assign 
    } 

    return state; // return after the switch instead of default 
} 

updateUser({ email: 'new email', name: 'some guys name'}); 
+1

情報のおかげでありがとう私はこのアドバイスを使用します。 –

1

私は、あなたの質問にはすべてのフィールドを返すことができるUPDATE_USER作用を有する、対別々UPDATE_USER_NAMEUPDATE_USER_EMAILアクションを持っていることについて尋ねていると仮定します。はい、それは絶対にうまくいきます。にはがあり、フォーム内のすべてのフィールドに別々のアクションタイプを定義しているとは限りません。

あなたの行動の命名と意図はあなた次第です。自分の状況に最も適したものを探し出し、コードを管理しやすく理解しやすくします。

ブログの投稿Idiomatic Redux: The Tao of Redux, Part 2 - Practice and Philosophyには、アクションのセマンティクスに関するいくつかの関連する考えが書かれています。

関連する問題