rematch简单使用

小鱼儿 2021-09-08 15:04 464阅读 0赞

import \{init,dispatch\} from 'rematch/core';

const count = \{

state:\{

number:0

\},

reducers:\{//一个改变该model state的所有函数的对象

increments:(state,payload) => state.number + payload,

decrements:(state,payload) => state.number - payload,

\},

effects:\{//方法都写在这里

async asyncIncrements(payload)\{//异步增加

await this.increments(payload);

\},

async asyncDecrements(payload)\{

await this.decrements(payload);

\}

\}

\}

const store = init(\{

models:\{count\},

redux:\{\}

\})

dispatch.count.asyncIncrements(10);//异步增加10

dispatch.count.asyncDecrements(10);//异步减少10

使用：

import React from 'react'

import \{connect\} from 'react-redux'

class App extends Component\{

addCount = (value)=>\{//异步增加数据

const \{ CountDispatch \} = this.props;

CountDispatch.asyncIncrements(value);

\}

cutCount = (value) =>\{//异步减少数据

const \{CountDispatch\} = this.props;

CountDispatch.asyncIncrements(value);

\}

render()\{

let \{CountNumbers\} = this.props;

return (

<div>

<p>获取count数据中的number变化：\{CountNumbers.number\}</p>

<input type="button" value="增加数据" onClick=\{this.addCount(10)\}/>

<input type="button" value="减少数据" onClick=\{this.cutCount(10)\}/>

</div>

)

\}

\}

const mapStateToProps =(state)=>\{

CountNumbers:state.count,//获取count数据

\}

const mapDispatchToProps=(dispatch)=>\{

CountDispatch:dispatch.count,//获取count方法

\}

export default connect(mapStateToProps,mapDispatchToProps)(App)

发表评论取消回复

表情：

评论列表（有 0 条评论，464人围观）

还没有评论，来说两句吧...

相关阅读

相关 react中使用redux最简单最方便的方式，配合rematch简化操作，5分钟学会

![13d348fadf724dbcb652817cf631f10f.jpeg][]react中使用状态管理的方式也很多，比如redux和mobx等，今天这一片就讲一下redu

男娘i/ 2024年02月05日 18:20/ 0 赞/ 5 阅读

相关 git 简单使用

git上一个分布式源码管理工具，可以离线提交 git分为工作区、暂存区（需要更总文件状态区）和历史区（提交后区域） git 全局配置文件在当前用户家目录的.gitconfi

冷不防/ 2022年08月05日 00:48/ 0 赞/ 246 阅读

相关 nginx简单使用

安装： groupadd -r -g 108 nginx useradd -r -g 108 nginx tar -xf ... cd

灰太狼/ 2022年08月04日 10:56/ 0 赞/ 218 阅读

相关 Gson简单使用

Gson工具类使用常用类：`JsonArray` `JsonElement` `JsonObject` `JsonParser` `TypeToken` 在线文档：

待我称王封你为后i/ 2022年03月11日 15:49/ 0 赞/ 400 阅读

相关 BigDecimal简单使用

List<String> list=new ArrayList<>(); list.add("11.1"); list.

末蓝、/ 2021年09月26日 17:00/ 0 赞/ 536 阅读

相关 fiddler简单使用

1、 Content-Type：请求响应的类型 1. 提示返回的类型，如json数据、html页面 2. https://www.cnblogs.com/klb561

蔚落/ 2021年09月24日 22:16/ 0 赞/ 437 阅读

相关 IPerf简单使用

一点睛 1 IPerf是一个服务器/客户端运行的程序 2 在服务器端运行iPerf，也需要在客户端运行IPerf。 3 服务器端，在命令行下使用iperf加参数-s。

迷南。/ 2021年09月19日 11:46/ 0 赞/ 491 阅读

相关 rematch简单使用

import \{init,dispatch\} from 'rematch/core'; const count = \{ state:\{ number:0

小鱼儿/ 2021年09月08日 15:04/ 0 赞/ 465 阅读

相关 MyBatisPlus--简单使用

创建Maven工程，引入依赖 <dependencies>  <de

朴灿烈づ我的快乐病毒、/ 2021年08月26日 18:33/ 0 赞/ 632 阅读

相关 Shiro--简单使用

创建Maven项目，添加依赖 <dependencies> <dependency> <grou

布满荆棘的人生/ 2021年08月24日 20:07/ 0 赞/ 502 阅读