使用redux简单的实现加法运算(简单的状态改变)
描述该做啥?(action)!具体怎么做(reducer)!统一规划(store:包含reducer+所有的state)
上代码:index.ios.js
import React, { Component } from 'react';
import {
AppRegistry,
} from 'react-native';
import { Provider } from 'react-redux';
import {createStore} from 'redux';
import APP from './app';
//创建reducer,传入初始化的状态,和需要改变的元素描述:action
//初始化状态
const initialState={defaultNum:10};
function add(state=initialState,action){
console.log("2"+action.type);
switch (action.type) {
case "ADD_ONE":
let ss=Object.assign({},state,{defaultNum:state.defaultNum-1})
return ss;
default:
return state;
}
}
class test extends Component{
constructor(props){
super(props);
this.state={
store:createStore(add),
};
}
render(){
return(
<Provider store={this.state.store}>
<APP store={this.state.store}/>
</Provider>
);
}
}
AppRegistry.registerComponent('test', () => test);
在上面的入口代码中,先是定义了reducer,来具体做一些事,用reducer作为参数来创建store,然后通过Provider来将store传入入口<APP/>组件中!然后看APP.js的代码:
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
} from 'react-native';
import {connect} from 'react-redux';
//action
let action={type:"ADD_ONE"};
class APP extends Component {
constructor(props){
super(props);
this.state={
}
}
_onpress(){
console.log("1"+this.props.defaultNum);
this.props.dispatch(action);
}
render() {
return (
<View style={styles.container}>
<Text style={styles.text} onPress={this._onpress.bind(this)}>{this.props.defaultNum}</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
text:{
fontSize:40
}
});
function select(state){
console.log("3"+state.defaultNum);
return {defaultNum:state.defaultNum}
}
export default connect(select)(APP)
在APP.js代码中,我们首先定义了action(当然这些都是可以在外部写的) 然后通过文本的点击事件触发action,将这个action通过store中的dispatch分发到reducer中!那么
export default connect(select)(APP)
就是包装APP组件,将store的dispatch方法传入this.props中!
当reducer运行结束后,返回的数据由
export default connect(select)(APP)
中的select来更新当前的数据。 相关链接:http://www.jianshu.com/p/e261818be3ff
使用redux简单的实现加法运算(简单的状态改变)的更多相关文章
- 简单的新手加法运算(基于Struts2)
软件151 王帅 在搭好框架的前提下,首先编写action.java文件: import com.opensymphony.xwork2.ActionSupport; public class Us ...
- ajax 的简单请求,get的加法运算,post加法运算,用户登录认证
视图函数部分 from django.shortcuts import render, HttpResponse import time from app01.models import User i ...
- jQuery的加法运算.
jQuery的加法运算. 加法运算 ?想必大家听到这都会不屑了,加法运算这是多么简单的运算.然而有的时候在jQuery也让人挺头疼的. 常规的是: var num1 = 123; var num2=1 ...
- 整数运算:CPU内部只有加法运算
学汇编的一边儿去.我这里讲的是CPU进行计算的原理.首先我这里用MC的红石电路模拟了一个加法器:http://www.0xaa55.com/thread-313-1-1.htm首先加法器是怎么实现的呢 ...
- RNN入门(4)利用LSTM实现整数加法运算
本文将介绍LSTM模型在实现整数加法方面的应用. 我们以0-255之间的整数加法为例,生成的结果在0到510之间.为了能利用深度学习模型模拟整数的加法运算,我们需要将输入的两个加数和输出的结果 ...
- HDU 1002 (高精度加法运算)
A + B ProblemII Time Limit: 2000/1000 MS(Java/Others) Memory Limit: 65536/32768 K (Java/Others) T ...
- 小白专场-多项式乘法与加法运算-c语言实现
目录 一.题意理解 二.求解思路 三.多项式的表示 3.1 数组 3.2 链表 四.程序框架搭建 五.如何读入多项式 六.如何将两个多项式相加 七.如何将两个多项式相乘 八.如何将多项式输出 一.题意 ...
- jQuery的加法运算,val()获取的结果相加变成了字符串连接。
加法运算 ?想必大家听到这都会不屑了,加法运算这是多么简单的运算.然而有的时候在jQuery也让人挺头疼的. 常规的是: var num1 = 123; var num2=123; var total ...
- WeX5的简单介绍及UI的简单讲解
WeX5的简单介绍及UI的简单讲解 (2016-01-13 14:49:05) 标签: it 分类: WeX5的初步自学 一.WeX5的简单讲解 1.WeX5是前端快速开发框架,可开发跨端运行应用.是 ...
随机推荐
- Radio中REG
Auto REG/REG OFF在广播接收质量不好时,收音机首先仅调整到该广播电台当前发射的可选频率.但是,如果接收质量差到“该发射电台濒临消失”的程度,则收音机也会接收德国NDR1(北德意志广播电台 ...
- linux 开始
3306 -- mysql 8000--django默认 服务由端口控制 https -- 443 http -- 80 linux发行版:1.centos 免费版的redhat2.ubuntu 乌版 ...
- JustOJ1500: 蛇行矩阵
题目链接:https://oj.ismdeep.com/problem?id=1500 题目描述 蛇形矩阵是由1开始的自然数依次排列成的一个矩阵上三角形. 输入 本题有多组数据,每组数据由一个正整数N ...
- linux centos6.5 php5.6 安装PHPUnit 5.2.9 (转)
转自:http://blog.csdn.net/shancunxiaoyazhi/article/details/50765293 操作系统版本:CentOS6.5 PHP版本:5.6 下载phpun ...
- Django之MVC和MTV
一. MVC MVC 是一种使用 MVC(Model View Controller 模型-视图-控制器)设计创建 Web 应用程序的模式: Model(模型)表示应用程序核心(比如数据库记录列表). ...
- 深度挖掘,Html5的 Range 滑动刻度的坑,兼容全平台,将任性进行到底!
最近2天一直在弄一个滑动的刻度效果,由于项目是基于Web App开发的,于是考虑到 移动端和pc端 的兼容性问题,考虑的比较多,尝试采用 Html5的Range 来做,目前已经兼容 pc端和移动端! ...
- 【题解】Luogu P2604 [ZJOI2010]网络扩容
原题传送门:P2604 [ZJOI2010]网络扩容 这题可以说是板题 给你一个图,先让你求最大流 再告诉你,每条边可以花费一些代价,使得流量加一 问至少花费多少代价才能使最大流达到k 解法十分简单 ...
- 存根类(stub) 是什么意思?有什么作用?(转)
存根类是一个类,它实现了一个接口,但是实现后的每个方法都是空的. 它的作用是:如果一个接口有很多方法,如果要实现这个接口,就要实现所有的方法.但是一个类从业务来说,可能只需要其中一两个方法. 如 ...
- ant安装
- topcoder srm 680 div1
problem1 link 将限制按照$x$排序.那么$[upTo_{i}+1,upTo_{i+1}]$中数字个数为$quantity_{i+1}-quantity_{i}$.然后进行动态规划.$f[ ...