組み込み関数はmapDispatchToPropsのownPropsから来ました

Question

私の反応コンポーネントでは、標準アクションとownPropsで受け取った関数を組み合わせることができますか？それ、どうやったら出来るの？フォローアップの質問は、ownPropsでは、オブジェクトと関数を得ることができるということです。私は誤ってオブジェクトを自分の行動に入れないようにしたいと思っています。機能だけが自分の行動に入るはずです。

最終的には、this.props.actions.standardAction1またはthis.props.actions.actionReceivedThruOwnPropsと入力する必要があります。

import React, {Component} from 'react'; 
import {connect} from 'react-redux'; 
import {bindActionCreators} from 'redux'; 

import * as standardActions from '../actions/standardActions'; 

class MyComponent extends Component { 

    constructor(props) { 

     super(props); 
    } 

    render() { 

     return(
      <div>Something goes here...</div> 
     ); 
    } 
} 

function mapStateToProps(state) { 
    return { 
     something: state.something 
    } 
} 

function mapDispatchToProps(dispatch, ownProps) { 
    return { 
     actions: bindActionCreators(standardActions, dispatch) 
    }; 
} 

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent) 

Answer 1

あなたはFUL持っています最後の小道具がどのようにコンポーネントに渡されたかについての制御は、次のようになります。 react-reduxデコレータ/関数connectの3番目の引数を使用することができます。

マップされた状態をmapStateToPropsから、バインドされたアクションをmapDispatchToPropsから、自分の小道具を親からコンポーネントに渡して定義する関数を定義します。その後、望むようにそれらをマージします。

function mapStateToProps(state) { 
    return { 
     something: state.something, 
    } 
} 

function mapDispatchToProps(dispatch, ownProps) { 
    return { 
     ...bindActionCreators(standardActions, dispatch), 
    }; 
} 

function mergeProps(stateProps, dispatchProps, ownProps) { 
    return { 
     ...ownProps, 
     state: stateProps, 
     actions: { 
      ...dispatchProps, 
      ...ownProps.actions, 
     }, 
    }; 
} 

connect(
    mapStateToProps, 
    mapDispatchToProps, 
    mergeProps 
)(SuperComponent) 

Answer 2

あなたがこれを行うことができますが、私は関数がownPropsに存在する方法については本当にわからないんだけど：

function mapDispatchToProps(dispatch, ownProps) { 
    return { 
     actions: { 
     ...bindActionCreators(standardActions, dispatch),  
     ...ownProps 
     } 
    }; 
} 

あなたが関数からのアクションを分けたい場合は、あまりにもこれを確認がownPropsから来た：

function mapDispatchToProps(dispatch, ownProps) { 
    return { 
     actions: bindActionCreators(standardActions, dispatch),  
     ownProps: ownProps, 
     } 
    }; 
} 

、その後、あなたがそのようにそれを呼び出す：this.props.ownProps.actionReceivedThruOwnProps