redux的bindActionCreators源码,中文翻译

 如果不清楚 可以查看https://segmentfault.com/a/1190000018395291

 

bindActionCreators就是给action创建函数绑定了dispatch,可以直接以普通函数执行,而不用dispatch(actionCreator)这样写.比如下面,bindActionCreators生成一个对象,对象里面的value值是function,那么可以直接this.boundActionCreators.addTodo()执行**

 

 

源码:

function bindActionCreator(actionCreator, dispatch) {

      return (...args) => dispatch(actionCreator(...args))

}

 

/**

* Turns an object whose values are action creators, into an object with the

* same keys, but with every function wrapped into a `dispatch` call so they

* may be invoked directly. This is just a convenience method, as you can call

* `store.dispatch(MyActionCreators.doSomething())` yourself just fine.

*

* 将一个value值是action创建函数的对象变成一个具有相同key值的对象,但是每个函数都被封装到

* `dispatch`回调里面,这样它们就有可能被直接触发. 这样只是比较方便,你也可以调用

* `store.dispatch(MyActionCreators.doSomething())`

*

* For convenience, you can also pass a single function as the first argument,

* and get a function in return.

*

* 为了方便,你也可以传单个函数作为第一个参数,然后返回一个函树

*

* @param {Function|Object} actionCreators An object whose values are action

* creator functions. One handy way to obtain it is to use ES6 `import * as`

* syntax. You may also pass a single function.

*

* actionCreators 是一个value值是action创建函数的对象,一个很方便获取到它的方法就是

* 使用ES6 的`import * as `语法.也可以传单个函数

*

* @param {Function} dispatch The `dispatch` function available on your Redux

* store.

*

* dispatch就是redux 里store的dispatch

*

* @returns {Function|Object} The object mimicking the original object, but with

* every action creator wrapped into the `dispatch` call. If you passed a

* function as `actionCreators`, the return value will also be a single

* function.

*

* 返回的对象和初始的对选象很像,但每一个action创建函数都给封装到`dispatch`回调里面

* 如果你传单个函数作为`actionCreators`,那返回值也是一个单个函数

*/

export default function bindActionCreators(actionCreators, dispatch) {

              if (typeof actionCreators === 'function') {

                           return bindActionCreator(actionCreators, dispatch)

               }

 

              if (typeof actionCreators !== 'object' || actionCreators === null) {

                   throw new Error(

                        `bindActionCreators expected an object or a function, instead received ${actionCreators === null ? 'null' : typeof                          actionCreators}. ` +`Did you write "import ActionCreators from" instead of "import * as ActionCreators from"?`

                  )

                     //bindActionCreators的参数应该是对象或者函数,而不是空或其他类型,

                     //你是不是把"import * as ActionCreators from"写成了"import ActionCreators from"?

                }

 

               const keys = Object.keys(actionCreators)

               const boundActionCreators = {}

               for (let i = 0; i < keys.length; i++) {

                      const key = keys[i]

                      const actionCreator = actionCreators[key]

                      if (typeof actionCreator === 'function') {

                              boundActionCreators[key] = bindActionCreator(actionCreator, dispatch)

                       }

               }

            return boundActionCreators

}

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值