2016-09-18 4 views
0

私は3つのレデューサーでclientPrivileges,userFilterおよびuserDataの3つのレデューサーを使用した反応性還元アプリを持っています。別の状態からのデータに依存するアクション

テーブルコンポーネントは各ユーザーのデータを表示するために使用され、ドロップダウンコンポーネントは特定のユーザー用にこのテーブルをフィルタリングするために使用されます。特定のユーザーに対してドロップダウンが選択されると、データを取得するためにバックエンドを呼び出す必要があります。あなたは、私がバックエンドだけでなく、userIdに送信する必要がaccessTypeIdと呼ばれる引数を持っていることがわかりますしかし

selectUser(userId, dispatch) { 
    api.getUserData(userId, accessTypeId, (data) => { 
     dispatch(userActions.update(data)); 
    }); 

    return{ 
     type: selectUser, 
     userId 
    } 
} 

:これは、この関連付けられたアクションです。この値は、アプリにログインするときにclientPrivilegesレデューサーを使用して店舗で設定されています。

mapStateToPropsにドロップダウンコンポーネントの小道具としてaccessTypeIdを設定する以外の方法はありません。そして、コンポーネント自体で:

this.props.users.map(u => { 

    function onClick() 
    { 
     selectEndUserGroup(u.id, this.props.accessTypeId); 
    } 
    return <div id={"filter_group_"+u.id} key={u.id} onClick={onClick}>{name}</div> 

しかし、今、私はaccessTypeId財産と私の一般的なドロップダウンコンポーネントを破壊してきました。私はこれをどのようにしなければならないのですか?

答えて

1

私が正しく理解している場合、Redux状態に格納されている値にアクセスする必要がありますか?

Redux-Thunkはこれをうまく処理します。コードは次のようになります。

selectUser(userId) { 
    return function(dispatch, getState){ 

     var accessTypeId = getState().[PATH TO REDUX STATE ELEMENT] 
     api.getUserData(userId, accessTypeId, (data) => { 
      dispatch(userActions.update(data)); 
     }); 

     dispatch({ 
      type: selectUser, 
      userId 
     }) 
    } 
} 
関連する問題