1、先是安装reduxJx,  cnpm i --save rudux
2、创建一个store的js文件
3、使用import来引用 redux import { createStore } from 'redux'
4、然后在store 创建一个全局管理数据对象 const preloadState = {
cartList: []
}
5、处理全局数据的方法
const reducer = function(state, action){
// 参数state:上一次的state状态
// 参数action:事件描述对象
console.log(action.type);
处理数据方法
if (item.a === 0 ){
...代码
} //返回下一次全局使用的state状态
return state;
}
//创建仓库
const store = createStore(reducer, preloadState);
export default store
6、dispatch的使用
在store以外 store.dispatch()调用 参数1:设置store里面的action相对的type值,参数2:传递的数据
如下: store.dispatch({
type: 'add',
value: {
id: 2
}
})
然后在store里面的action里面可以获取到 type和传入的value值,也可以在全局管理数据中的state改变全局的数据
7、在组件(页面)中也可以通过store. getState()来获取你存储的相对应的值,
8、store.subscribe()的操作是基本用来监听 store里面的一些数据变化进行操作的,需要主要的是dispatch的操作顺序,

还有一些步骤操作没有具体说,

redux.js的基本使用的更多相关文章

  1. 配置react, redux, next.js环境

    1. react https://reactjs.org/docs/add-react-to-a-new-app.html npm install -g create-react-app create ...

  2. Redux状态管理方法与实例

    状态管理是目前构建单页应用中不可或缺的一环,也是值得花时间学习的知识点.React官方推荐我们使用Redux来管理我们的React应用,同时也提供了Redux的文档来供我们学习,中文版地址为http: ...

  3. Redux教程3:添加倒计时

    前面的教程里面,我们搭建了一个简单红绿灯示例,通过在console输出当面的倒计时时间:由于界面上不能显示倒计时,用户体验并不良好,本节我们就添加一个简单的倒计时改善一下. 作为本系列的最后一篇文章, ...

  4. Redux教程1:环境搭建,初写Redux

    如果将React比喻成士兵的话,你的程序还需要一位将军,去管理士兵(的状态),而Redux恰好是一位好将军,简单高效: 相比起React的学习曲线,Redux的稍微平坦一些:本系列教程,将以" ...

  5. Redux教程2:链接React

    通过前面的教程,我们有了简单的环境,并且可以运行Redux的程序,也对 如何编写Redux示例 有了初步的印象: 掌握了 使用Redux控制状态转移 ,继而驱动 React 组件发生改变,这才是学习R ...

  6. 【原】redux异步操作学习笔记

    摘要: 发觉在学习react的生态链中,react+react-router+webpack+es6+fetch等等这些都基本搞懂的差不多了,可以应用到实战当中,唯独这个redux还不能,学习redu ...

  7. 学 Redux (转)

    0.官方文档:http://redux.js.org/ 中文版本 :  http://cn.redux.js.org/ 中文版本(好!):   http://www.css88.com/react/d ...

  8. redux学习笔记

    中文api:http://cn.redux.js.org/docs/react-redux/troubleshooting.html 3.6 Reducer Store 收到 Action 以后,必须 ...

  9. [转] What is the point of redux when using react?

    As I am sure you have heard a bunch of times, by now, React is the V in MVC. I think you can think o ...

随机推荐

  1. laravel 文件

    用laravel处理上传的文件 1.获取上传的文件 $file=$request->file('file');2.获取上传文件的文件名(带后缀,如abc.png) $filename=$file ...

  2. Java练习 SDUT-2400_高中数学?

    高中数学? Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 高中数学大家都学过数列,其中一个重要的概念就是数列的通项,可 ...

  3. TIJ——Chapter Four:Controlling Execution

    同上一章,本章依然比较简单.基础,因此只是做一些总结性的笔记. 1. 不像C和C++那样(0是假,非零为真),Java不允许用一个数字作为boolean值. 2. C中,为了给变量分配空间,所有变量的 ...

  4. Oracle(ERROR SP2-0642)

    阅读目录 报错信息 解决方法 回到顶部 报错信息 ERROR SP2-0642 回到顶部 解决方法 [oracle@oradb]$ sqlplus / as sysdba SP2-0642: SQL* ...

  5. python 数据集变量的数据类型总结

  6. 阿里云:面向5G时代的物联网无线连接服务

    在4月24日落幕的2019中国联通合作伙伴大会“5G+物联网(IoT)论坛”上,阿里云高级运营专家李茁出席圆桌对话,分享了5G时代物联网如何更好地推动行业完成生产.管理和商业模式的创新,阿里云又会以何 ...

  7. 前后端登录注册之node剖析与token的使用状态

    登录模块功能详解 1.用户名密码的格式验证 由前端完成,根据需求自行决定,不加叙述 2.点击提交按钮思路详解 前端将用户名 以及加密后的密码还有验证码输入的内容统一发给后端  由后端和数据库的数据进行 ...

  8. Pytorch - GPU ID 指定 pytorch gpu 指定

    PyTorch 关于多 GPUs 时的指定使用特定 GPU. PyTorch 中的 Tensor,Variable 和 nn.Module(如 loss,layer和容器 Sequential) 等可 ...

  9. python初识参数

    1. 什么是函数? f(x) = x + 1 y = x + 1 函数是对功能或者动作的封装 2. 函数的语法和定义 def 函数名(): 函数体 调用: 函数名() 3. 关于函数的返回值 retu ...

  10. 洛谷P3366 【模板】最小生成树(kuskal)

    #include<bits/stdc++.h> using namespace std; ; ; struct node{ int cnt,fa; }f[maxn]; inline voi ...