Redux学习篇:关于store.subscribe()监听方法与取消监听的认识

Store 允许使用store.subscribe方法设置监听函数，一旦 State 发生变化，就自动执行这个函数。

store.subscribe方法返回一个函数，调用这个函数就可以解除监听。

完整代码

import React, {useEffect} from 'react';
import store from '../../Store/index';
import {addAction, decAction} from '../../Action';export default function Three(props:any){const add = (payload:number) => {return () => {const actionAdd = addAction(payload);store.dispatch(actionAdd)}}const dec = (payload:number) => {return () => {const actionDec = decAction(payload);store.dispatch(actionDec);}}useEffect(() => {// 监听state的变化let unsubscribe  = store.subscribe(() => {console.log('监听中..',store.getState())})return () => {// 取消监听unsubscribe();}},[])return(<><h2>这是Ⅲ页</h2><button onClick={add(4)}>点击添加4</button> &nbsp; <button onClick={dec(2)}>点击减去2</button></>)
}

Redux学习篇:关于store.subscribe()监听方法与取消监听的认识相关推荐

React (fetch redux初识 state action reducer getState dispatch .subscribe 取消监听 ActionTypes Action Crea）
axios数据交互安装axios cnpm i axios --save 2.发起http请求 this.axios.get('/api/menulist').then(res=>{conso ...
eNSP第五篇扩展1：vrrp over nqa，nqa探测，双重vrrp监听方法1，vrrp与nqa结合
vrrp over nqa 相信学习到这里的同学,已经不需求我在这里为大家讲解nqa到底是怎么一个技术,本篇着重讲述nqa和vrrp联合的一个工作场景是这样的: nqa与vrrp结合适合的最独特的场景 ...
oracle 怎么看监听文件,【学习笔记】Oracle11G关于监听文件位置与监听文件大小限制...
[学习笔记]Oracle11G关于监听文件位置与监听文件大小限制时间:2016-11-07 21:21 来源:Oracle研究中心作者:HTZ 点击: 次天萃荷净 Oracle研究中 ...
(9) ebj学习: Jpa的增删查改,CURD方法监听和命名查询
1 整体结构 client文件存放 ejb客户端的一些jar包 Animal.java 中配置命名查询 Person.java 中实现了方法监听和类监听两种监听方式( 在增删查改方法执行之前后之后调用 ...
vue学习篇--02内置指令计算属性侦听属性
文章目录 18个指令 v-text v-html: v-show: v-if: v-for: 可以遍历数组对象数字字符串 v-bind: 解析属性:title src href type alt ...
HTML学习14-js 内置对象 Date() 常用的日期的方法定时器倒计时监听事件
内置对象内置对象: 内置对象就是指这个语言自带的一些对象,供开发者使用,这些对象提供了一些常用的或是最基本而必要的功能. 手机买来就能发短信就能打电话日期函数 ( Date() ) 这个函数 ( ...
Router+Redux学习总结
一.React-Router配置路由在实际应用中,我们不可能只有一页页面,切换页面需要通过Router配置,这样输入不同的url就能看到不同的页,或者点击不同的按钮可以在下方加载不同的组件. (说明 ...
Redux 学习总结 (React)
在 React 的学习和开发中,如果 state (状态)变得复杂时(例如一个状态需要能够在多个 view 中使用和更新),使用 Redux 可以有效地管理 state,使 state tree 结构 ...
Redux 学习笔记
1:首先安装redux: npm install --save redux 2:引入redux : import { createStore } from 'redux'; //首先创建执行函数,Re ...
redux学习笔记归纳
设计思想: (1)Web 应用是一个状态机,视图与状态是一一对应的. (2)所有的状态,保存在一个对象里面. 核心源码: 基本概念: 1.Store:就是保存数据的地方,你可以把它看成一个容器.整个 ...

Redux学习篇:关于store.subscribe()监听方法与取消监听的认识

Redux学习篇:关于store.subscribe()监听方法与取消监听的认识相关推荐

最新文章

热门文章