redux的bindActionCreators


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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM