理解ReduxForm関数の構文を接続

Question

私は慣れています何：mapDispatchToPropsはこのように見ていると

export default connect(mapStateToProps, mapDispatchToProps)(BookList); 

：

私はこのような何かを見ることに慣れている

function mapDispatchToProps(dispatch) { 
    return bindActionCreators({selectBook: selectBook}, dispatch); 
} 

を何私は（ReduxFormで）出会った：

export default reduxForm({ 
    validate, 
    form: 'PostsNewForm' 
})(
    connect(null, {createPost})(PostsNew) 
); 

私はこの部分特に困惑：connect(null, {createPost})(PostsNew)を見つける。

このコード行と上記のコードとの違いはどのくらいですか？ MapDispatchToPropsが必要なのはなぜですか？

Answer 1

必要に応じてmapStateToPropsを使用できます。ただし、react-reduxでは必須ではありません。 DOCSから取ら

例：

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

class Example extends Component { 
    // ... 
}; 

const mapStateToProps = (state) => ({ 
    // ... 
}); 

const mapDispatchToProps = (dispatch) => ({ 
    // ... 
}); 

Example = connect(
    mapStateToProps, 
    mapDispatchToProps 
)(Example); 

export default reduxForm({ 
    form: 'example' // a unique name for this form 
})(Example); 

Answer 2

ConnectのmapDispatchToPropsは、あなたが（最終的な結果は、あなたのコンポーネントに渡される）にマッピングする機能が同じを持っている場合には、ある、オブジェクトリテラルの短縮形を許可します派遣されるアクションクリエイターとしての署名、それはすべてbindActionCreatorのものを行う必要がある雑音のようなものです。オブジェクトリテラルをmapDispatchToProps引数として渡すと、これを行うためにreact-reduxに指示します。

だから、あなたの最初の例はまた、あなたは{ selectBook }と{ selectBook: selectBook }が同等である理由がわからない場合は、以下のMDNのリンクを見てみたいことがあり

connect(mapStateToProps, { selectBook })(BookList) 

ように書き換えることができます。

参照： https://github.com/reactjs/react-redux/blob/master/docs/api.md#inject-todos-and-specific-action-creators-addtodo-and-deletetodo-with-shorthand-syntax

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#New_notations_in_ECMAScript_2015