(五)Redux入门
1 Redux概念简述


flux推出的时候有一些缺点。比如store可以存在多个,不是特别好用 于是逐渐进化为了redux。
2 Redux的工作流程

拿借书作举例:
action creators是”我要借书”这句话
store是图书管理员 reducer是小手册 查询到这本书在哪
3 使用antd编写TodoList页面布局
4 创建redux中的Store
如何创建store :
1 引入redux中的{createStore}
2 把reducer传递给创建store的函数
reducer 要求是一个函数,接收state和action 返回state

5Action和Reducer的编写
先来介绍一下redux_dev_tools的使用

6 使用Redux完成TodoList删除功能
7 ActionTypes的拆分

把action types抽离开来 防止会有把type代码拼写错的情况发生
8 使用actionCreator统一创建action

再一次抽离
极大的提高代码的可维护性

9 Redux知识点复习补充
1.store是唯一的
2.只有store能够改变自己的内容
# 很多人认为是reducer改变了state,改变了store里的内容,
其实不是这样 reducer只是拿到之前的数据,生成新的数据,把新的数据返回给了store
store拿到这个数据 他把自己的数据进行一个更新 所以其实是store自己gengxin的
3. reducer必须是纯函数
( # 总结一下:其实就是要求reducer必须是一个纯函数,而且这个纯函数不能有任何副作用。 )
// reducer可以接受state,但是绝对不能修改state
// 纯函数指的是,给定固定的输入,就一定会有给定的输出,而且不会有任何副作用(幂等)
纯函数:

(这个就不是纯函数,因为有new Date,不能有异步操作或者跟时间相关的操作)
副作用:

(这个就是副作用,对传入的参数state.inputValue进行了修改了)
createStore
store.dispatch
store.getState
store.subscribe
(五)Redux入门的更多相关文章
- Redux 入门到高级教程
Redux 是 JavaScript 状态容器,提供可预测化的状态管理. (如果你需要一个 WordPress 框架,请查看 Redux Framework.) Redux 除了和 React 一起用 ...
- Redux 入门教程
Redux 入门教程(三):React-Redux 的用法(53@2016.09.21) Redux 入门教程(二):中间件与异步操作(32@2016.09.20) Redux 入门教程(一):基本用 ...
- Redux入门
Redux入门 本文转载自:众成翻译 译者:miaoYu 链接:http://www.zcfy.cc/article/4728 原文:https://bumbu.github.io/simple-re ...
- Redux 入门教程(三):React-Redux 的用法
为了方便使用,Redux 的作者封装了一个 React 专用的库 React-Redux,本文主要介绍它. 这个库是可以选用的.实际项目中,你应该权衡一下,是直接使用 Redux,还是使用 React ...
- Redux 入门教程(二):中间件与异步操作
上一篇文章,介绍了 Redux 的基本做法:用户发出 Action,Reducer 函数算出新的 State,View 重新渲染. 但是,一个关键问题没有解决:异步操作怎么办?Action 发出以后, ...
- Kaggle初学者五步入门指南,七大诀窍助你享受竞赛
Kaggle 是一个流行的数据科学竞赛平台,已被谷歌收购,参阅<业界 | 谷歌云官方正式宣布收购数据科学社区 Kaggle>.作为一个竞赛平台,Kaggle 对于初学者来说可能有些难度.毕 ...
- Redux 入门教程(一):基本用法
转自http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_one_basic_usages.html(仅供个人学习使用) 首先明确一点, ...
- redux入门指南
前言:大概一个月没有写博客了,这两天正好是周末,就写点东西来梳理下之前几个月的所写与所得; 大概两个月前,学习了一下 redux ,还是一点难度的,花了我一天的时间来搞明白他, 但是都没怎么记录,今天 ...
- .NET Core实战项目之CMS 第五章 入门篇-Dapper的快速入门看这篇就够了
写在前面 上篇文章我们讲了如在在实际项目开发中使用Git来进行代码的版本控制,当然介绍的都是比较常用的功能.今天我再带着大家一起熟悉下一个ORM框架Dapper,实例代码的演示编写完成后我会通过Git ...
随机推荐
- ZBrush中关于标记的特殊情况
在ZBrush®中使用Marker标记调控板来记忆物体属性,因此能在任何时间回到标记并使用它给其他物体或改变物体作为参考点,在使用Marker标记调控板时回出现很多特殊情况,本文小编就这些特殊情况做一 ...
- IPv6特性,以及SLAAC过程
1. IPv6特性 支持即插即用: 路由器发现(Router Discovery):当一个节点连接到一个IPv6的链路上时,它能够发现本地的路由器,而不必借助动态主机配置协议(DHCP). 前缀发现( ...
- ES6 Symbol类型 附带:Proxy和Set
七种数据类型 ·Symbol ·undefined ·null ·Boolean ·String ·Number ·Object let a = Symbol('this is a symbol'); ...
- vue项目初始化步骤
项目初始化:() 1. 安装vue-cli : npm install -g vue-cli 2.初始化项目: vue init webpack my-project 3.进入项目: c ...
- HDU 1575 Tr A( 简单矩阵快速幂 )
链接:传送门 思路:简单矩阵快速幂,算完 A^k 后再求一遍主对角线上的和取个模 /********************************************************** ...
- PHP算法之四大基础算法
前言 虽然工作中,你觉得自己并没有涉及到算法这方面的东西,但是算法是程序的核心,一个程序的好与差,关键是这个程序算法的优劣,所以对于冒泡排序.插入排序.选择排序.快速排序这四种基本算法,我想还是要掌握 ...
- [luogu] P3202 [HNOI2009]通往城堡之路(贪心)
P3202 [HNOI2009]通往城堡之路 题目描述 听说公主被关押在城堡里,彭大侠下定决心:不管一路上有多少坎坷,不管城堡中的看守有多少厉害,不管救了公主之后公主会不会再被抓走,不管公主是否漂亮. ...
- Docker决战到底(三) Rancher2.x的安装与使用 - 简书
原文:Docker决战到底(三) Rancher2.x的安装与使用 - 简书 image.png 当越来越多的容器化应用被部署,一个可以管理编排这些容器的工具此时就显得尤为重要了.目前容器编排领域 ...
- mybatis-plus注解版实现多表联查(sql)
mybatis注解版实现多表联查 需求: 用户有角色,角色有权限,需要一次取用户信息包含角色信息及其对应权限 实体类: package cn.zytao.taosir.common.model.use ...
- (转)redis源代码分析 – event library
每个cs程序尤其是高并发的网络服务端程序都有自己的网络异步事件处理库,redis不例外. 事件库仅仅包括ae.c.ae.h,还有3个不同的多路复用(本文仅描述epoll)的wrapper文件,事件库封 ...