bindActionCreators是redux的一個API,作用是將單個或多個ActionCreator轉化為dispatch(action)的函式集合形式。
開發者不用再手動dispatch(actionCreator(type)),而是可以直接呼叫方法。
目的就是簡化書寫,減輕開發負擔。
例如:
actionCreator.js如下:
export function addTodo(text) { return { type: 'ADD_TODO', text } } export function removeTodo(id) { return { type: 'REMOVE_TODO', id } }
匯出的物件為:
{ addTodo : text => { type: 'ADD_TODO', text }, removeTodo : id => { type: 'REMOVE_TODO', id } }
是以函式名為key,函式為value的一個物件
經過bindActionCeators的處理變為:
{ addTodo : text => dispatch(addTodo('text')); removeTodo : id => dispatch(removeTodo('id')); }
是以函式名為key,內部執行dispatch(action)的函式為value的物件,用這個物件就可以直接呼叫方法了,不必手動dispatch
如果傳入單個actionCreator,則返回的是一個包裹dispatch的函式,而不是一個物件。
通常用在mapDispatchToProps中,向元件傳遞action方法:
export default connect( (state,props) => { return {data: state.article.data,currentCate:fCurrentCate(state,props)} }, dispatch => { return {actions: bindActionCreators(acts,dispatch)} } )(Article);
通過actions物件呼叫方法,就可以dispatch所有的action
參考:https://segmentfault.com/a/1190000011783611