react native 中的redux
一、使用redux 的条件:
1、某个组件的状态,需要共享;
2、某个状态需要在任何地方都可以拿到;
3、一个组件需要改变全局状态;
4、一个组件需要改变另一个组件的状态。
redux 说明白点,其实就是一种机制,可以在同一个地方查询状态、改变状态、传播状态的变化。
二、redux 中的store
store 可以认为是一个保存数据的地方,可以看成一个容器。
通过createStore 来生成store;
通过store.getState() 拿到数据;
三、redux 中Action
View 通过Action 来改变state,它会运送数据到store。Action 是一个对象,其中type 属性是必须的,表示Action的名称。
四、redux 中的dispatch()
store.dispatch ()是View 发出Action 的唯一方法。
五、reducer
store 收到Action 以后,必须给出一个新的state,这样View 才会发生变化。这种state的计算过程就叫做reducer。
reducer 是一个纯函数,它接受Action 和当前state作为参数,返回一个新的state。
const reducer = function (state, action) {
// ...
return new_state;
};
实际中的运用:
import { createStore } from 'redux';
const store = createStore(reducer);
上面代码中,createStore 接受Reducer 作为参数,生成一个新的Store。以后每当store.dispatch 发送过来一个新的Action,就会自动调用reducer,得到新的state。
六、reducer 纯函数
纯函数的一个特性就是:只要是同样的输入,必定得到同样的输出。
纯函数是函数式编程的概念,必须遵守以下的一些约束:
1、不得改写参数;
2、不能调用系统I/O的API;
3、不能调用Date.now 或者Math.random ()等不纯的方法,因为每次会得到不一样的结果
reducer 函数里面不能改变state,必须返回一个全新的对象。
react native 中的redux的更多相关文章
- 在 React Native 中使用 Redux 架构
前言 Redux 架构是 Flux 架构的一个变形,相对于 Flux,Redux 的复杂性相对较低,而且最为巧妙的是 React 应用可以看成由一个根组件连接着许多大大小小的组件的应用,Redux 也 ...
- react native 中的redux 理解
redux 中主要分为三大块,分别是Action Reducer 与Store. 1.Action是js的一个普通对象,是store数据的唯一来源.通过store.dispath()讲action传到 ...
- React Native 中使用Redux
参考https://jspang.com/detailed?id=48和印度同事的代码简单整理一下在RN中使用Redux的步骤 1. 首先我们应该先了解Redux是什么,什么情况下需要用到它 在Red ...
- React Native 中 CSS 的使用
首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...
- react native中的欢迎页(解决首加载白屏)
参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...
- React Native中的网络请求fetch和简单封装
React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...
- [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势
http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...
- [转] 在React Native中使用ART
http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...
- 如何在非 React 项目中使用 Redux
本文作者:胡子大哈 原文链接:https://scriptoj.com/topic/178/如何在非-react-项目中使用-redux 转载请注明出处,保留原文链接和作者信息. 目录 1.前言 2. ...
随机推荐
- eclipse导入svn检出的maven项目问题
1.修改项目jdk环境和编译环境.消除红叉. 2.windows-preferences-java-installed jres,修改工作空间的jdk,在Default vm arguments栏中添 ...
- Jerasure库接口简介及性能测试
http://blog.chinaunix.net/uid-20196318-id-3277600.html Jerasure库提供Reed-Solomon和Cauchy Reed-Solomon两种 ...
- 虚拟机搭建--hyper-V使用教程
http://jingyan.baidu.com/article/4e5b3e19695d9f91901e24bb.html
- 自己写了一个超级简便且傻瓜式的且功能强大的CSV组件(并且代码优雅,绝对没有一行多余的代码)
github地址: https://github.com/yangfeixxx/chipsCSV.git 解决的问题:解决了传统的CSV工具类对于实体类无法自动化封装为带表头的CSV文件的痛点,在读取 ...
- 开店 BZOJ 4012
开店 [问题描述] 风见幽香有一个好朋友叫八云紫,她们经常一起看星星看月亮从诗词歌赋谈到人生哲学.最近她们灵机一动,打算在幻想乡开一家小店来做生意赚点钱.这样的想法当然非常好啦,但是她们也发现她们面临 ...
- js-判断当前页面是否在微信浏览器中打开
方案一:推荐 var ua = navigator.userAgent.toLowerCase(); var isWinxin = ua.indexOf('micromessenger') != -1 ...
- 多语言业务错误日志收集监控工具Sentry 安装与使用
Sentry 是一个实时事件日志记录和汇集的平台.其专注于错误监控以及提取一切事后处理所需信息而不依赖于麻烦的用户反馈. Sentry是一个日志平台, 它分为客户端和服务端,客户端(目前客户端有Pyt ...
- Spring的依赖注入概述
以下内容引用自http://wiki.jikexueyuan.com/project/spring/dependency-injection.html: 每个基于Java应用程序都有几个对象,这些对象 ...
- c++中c_str()函数
https://zhidao.baidu.com/question/104592558.html
- jmeter - DBC Request之Query Type
工作中遇到这样一个问题: 需要准备10W条测试数据,利用jmeter中的JDBC Request向数据库中批量插入这些数据(只要主键不重复就可以,利用函数助手中的Random将主键的ID末尾五位数随机 ...