码迷,mamicode.com
首页 > 其他好文 > 详细

Redux:action

时间:2017-09-10 00:07:27      阅读:162      评论:0      收藏:0      [点我收藏+]

标签:字符   dex   完全   nbsp   html   add   相同   logs   相关   

引入redux之后,代码中对组件state的更新变得规范而可控,不再是分散的一句句setState,而是将组件的state集合在一个单例store中,并以引用的方式获取各自的state。

对于state的更新操作,也依赖一个名为action的js对象,该对象包含了该次更新的相关信息。对于store而言,action是外部信息注入的唯一途径,store调用api:store.dispatch()

type属性:

    每个action必须有一个type属性,表示该次state更新属于哪种类型,值为字符量。除了type属性之外,action没有其他默认或强制的属性,完全由我们按需创建。文档只是建议我们给action携带尽量少的信息。

Action Creators:

    redux中把构造action的函数称为action creator。其实就是个普通函数:

1 function addTodo(text) {
2   return {
3     type: ADD_TODO,
4     text
5   }
6 }

在Flux中,有的构造函数在创建完action对象后,直接调用dispatch方法触发更新,redux中也有相同的实现:

1 dispatch(addTodo(text))
2 dispatch(completeTodo(index))

上面两行代码可以再包装、完善一下:

1 const boundAddTodo = text => dispatch(addTodo(text))
2 const boundCompleteTodo = index => dispatch(completeTodo(index))

以后直接调用上面代码,就能创建并执行某类型的state更新了。

另,dispatch方法除了store.disptach(),还能通过 react-redux‘s connect()以及bindActionCreators()方法将action creators 绑定到dispatch()的方式使用。这个以后再讨论。

 

 

 

 

 

 

 

   

Redux:action

标签:字符   dex   完全   nbsp   html   add   相同   logs   相关   

原文地址:http://www.cnblogs.com/alan2kat/p/7499637.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!