1.redux:

function reducer(state=-,action)

{

switch(action.type)

{

case '':

return ...

case '':

return ...

default:

return ...

}

}

const store = createStore(reducer)

function listener(){

const current = store.getState()

console.log(current);

}

store.subscribe(listener)

store.dispatch({type:'...'})

2.redux配合react一起使用:

index.js

function render()

{

ReactDom.render(<App store={store}/>,document.getElementById('root'))

}

store.subscribe(render)

App.js: 里面是组件和store

index.reducer.js 里面是reducer 和 actioncreator

3.使用redux-thunk让redux处理异步:

一.安装redux-thunk

二.使用applyMiddleware开启thunk中间件

三.Action可以返回函数,使用dispatch提交action

首先开启中间件:

引入thunk:

然后创建store

调试工具:

4.使用react-redux:

npm install react-redux –save

忘记subscribe,只使用reducer、action、和dispatch

·Provier组件在应用最外层,传入store即可,只用一次

·Connect负责从外部获取组建需要的参数

index.js:

App.js(这是一个组件)

*用装饰器的方式书写:

Redux 总结的更多相关文章

  1. RxJS + Redux + React = Amazing!(译一)

    今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https:/ ...

  2. 通过一个demo了解Redux

    TodoList小demo 效果展示 项目地址 (单向)数据流 数据流是我们的行为与响应的抽象:使用数据流能帮我们明确了行为对应的响应,这和react的状态可预测的思想是不谋而合的. 常见的数据流框架 ...

  3. RxJS + Redux + React = Amazing!(译二)

    今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...

  4. redux学习

    redux学习: 1.应用只有一个store,用于保存整个应用的所有的状态数据信息,即state,一个state对应一个页面的所需信息 注意:他只负责保存state,接收action, 从store. ...

  5. webpack+react+redux+es6开发模式

    一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...

  6. Redux初见

    说到redux可能我们都先知道了react,但我发现,关于react相关的学习资料很多,也有各种各样的种类,但是关于redux简单易懂的资料却比较少. 这里记录一下自己的学习理解,希望可以简洁易懂,入 ...

  7. react+redux教程(八)连接数据库的redux程序

    前面所有的教程都是解读官方的示例代码,是时候我们自己写个连接数据库的redux程序了! 例子 这个例子代码,是我自己写的程序,一个非常简单的todo,但是包含了redux插件的用法,中间件的用法,连接 ...

  8. react+redux教程(七)自定义redux中间件

    今天,我们要讲解的是自定义redux中间件这个知识点.本节内容非常抽象,特别是中间件的定义原理,那多层的函数嵌套和串联,需要极强逻辑思维能力才能完全消化吸收.不过我会多罗嗦几句,所以不用担心. 例子 ...

  9. react+redux教程(六)redux服务端渲染流程

    今天,我们要讲解的是react+redux服务端渲染.个人认为,react击败angular的真正“杀手锏”就是服务端渲染.我们为什么要实现服务端渲染,主要是为了SEO. 例子 例子仍然是官方的计数器 ...

  10. react+redux教程(五)异步、单一state树结构、componentWillReceiveProps

    今天,我们要讲解的是异步.单一state树结构.componentWillReceiveProps这三个知识点. 例子 这个例子是官方的例子,主要是从Reddit中请求新闻列表来显示,可以切换reac ...

随机推荐

  1. 【推荐系统实战】:C++实现基于用户的协同过滤(UserCollaborativeFilter)

    好早的时候就打算写这篇文章,可是还是參加阿里大数据竞赛的第一季三月份的时候实验就完毕了.硬生生是拖到了十一假期.自己也是醉了... 找工作不是非常顺利,希望写点东西回想一下知识.然后再攒点人品吧,仅仅 ...

  2. rpm -qf 的使用技巧,以及怎样查找软件包

    首先查看安装的软件包,或者时候安装有某某软件包的命令 rpm  (-qa)| grep 软件名 root@mode oldboy]# rpm -qa| grep openssl openssl-dev ...

  3. github git.exe位置

    C:\Users\yourname\AppData\Local\GitHub\PortableGit_69703d1db91577f4c666e767a6ca5ec50a48d243\bin\git. ...

  4. Java之旅(二)--- ServletContext

     什么是ServletContext?  WEB容器在启动时,它会为每一个WEB应用程序都创建一个相应的ServletContext对象.它代表当前web应用.通过使用这个对象,servlet能够 ...

  5. [Servlet&amp;JSP] HttpSession会话管理

    我们能够将会话期间必须共享的资料保存在HttpSession中,使之成为属性.假设用户关掉浏览器接受Cookie的功能.HttpSession也能够改用URL重写的方式继续其会话管理功能. HttpS ...

  6. ZoomIt(投影演示辅助软件)下载、安装与运行使用

    下载ZoomIt后,打开即可使用:打开时,你讲看到如下的几个页面,这几个页面是为了介绍每个功能的使用,还可以去设定你觉得比较舒服的快捷键, 默认的是Ctrl+1屏幕放大.Ctrl+2屏幕标注,Ctrl ...

  7. codeforces 540 C Ice Cave【BFS】

    题意:给出一个n*m的矩阵,“.”代表完整的冰,“X”代表破碎的冰,现在为了前进,需要掉下去一层,唯一的方法就是从破碎的冰上面掉下去 然后给出起点还有终点,问能否可达 即为到达终点的时候,终点必须是破 ...

  8. POJ-1001 Exponentiation 高精度算法

    题目链接:https://cn.vjudge.net/problem/POJ-1001 以前写过一个高精度乘法,但是没有小数点,实现起来也没什么难得, 现在把代码都般过来,等会把旧电脑弄一弄,暂时就不 ...

  9. [POI2009]KON-Ticket Inspector(二维前缀和+DP)

    题意 有n个车站,现在有一辆火车从1到n驶过,给出aij代表从i站上车j站下车的人的个数.列车行驶过程中你有K次检票机会,所有当前在车上的人会被检票,问最多能检多少个不同的人的票 (n<=600 ...

  10. Spring MVC框架一个实例的手动实现

    文件结构: SpringMVC05 // 应用程序名 ----index.html // 欢迎文件,主目录下的文件可以被URL直接访问到 ----WEB-INF // 这个目录下的文件将被保护起来不能 ...