は私がmapDispatchToProps</p> <p>を理解しようとしている困難な時期を過ごしていmapDispatchToProps bindActionCreator

Question

を反応させ、ここで

const mapDispatchToProps =() => { 
    return { 
    addItem: addItem 
    }; 
}; 

を使用しているmapDispatchToProps機能がありますので、まさにここで起こっていることのaddItem機能は現在、小道具として利用可能であるということです反応成分に、右か？

ので、なぜ私たちは、特にこれらの行では、正確に何が起こっているか

return bindActionCreators({ 
     addItem: addItem 
     }, dispatch); 

をbindActionCreatorsを使用して、この

const mapDispatchToProps = (dispatch) => { 
    /* code change */ 
    return bindActionCreators({ 
    addItem: addItem 
    }, dispatch); 
}; 

が何をする必要がありますそして、なぜbindActionCreatorの作業をせずに、以前のコードをcouldntの？ 「アクションを送信する」

Answer 1

（通称：派遣）あなたはのはaddItemがfunction addItem() { return {type: 'addItem', payload: data}; };

のaddItemがアクションを返す関数であると仮定しましょうdispatch(actionCreator())

する必要があります。これはactionCreator（したがって：actionCreatorをバインド）ですが、ディスパッチしません。あなたはまだdispatchする必要がありますアクション。

mapDispatchToPropsには、dispatchという機能があります。その機能をディスパッチする必要があります。ここで

は、実行可能な例をいくつだ：

const bindActionCreators = (actionCreators, dispatch) => { 
    let boundActionCreators = {}; 
    return Object.keys(actionCreators).forEach(key => { 
     boundActionCreators[key] =() => { 
      dispatch(actionCreators[key]()); 
     }; 
    }); 
    return boundActionCreators; 
}; 

または、より冗長：あなたはそれを渡すオブジェクト内のすべてのactionCreatorため

const mapDispatchToProps = (dispatch) => { 
    return { 
     addItem:() => dispatch(addItem()), 
     addItemInline:() => dispatch({type: 'addItem', payload: 'data'}) 
    } 
}; 

bindActionCreatorsは、本質的には、これ以上何もしませんactionCreatorの結果をディスパッチする新しい関数を返します。