React Dva 操作models中的subscriptions讲述监听

接下来 我们来看一个models的属性
之前没有讲到的subscriptions

我们可以在自己有引入的任意一个models文件中这样写

subscriptions: {
    setup({ dispatch, history }) {
        console.log(dispatch);
    },
},

在这里插入图片描述
这样 一进来 这个位置就会触发
在这里插入图片描述
这里 我们可以写多个

subscriptions: {
    setup({ dispatch, history }) {
        console.log(dispatch);
    },
    mingt({ dispatch, history }) {
        console.log("你好");
    }
},

然后 我们运行后会发现 他们都是可以触发的
在这里插入图片描述
这里 我们可以用它来监听一些东西 然后触发我们models中的函数
例如

setup({ dispatch, history }) {
  window.onresize = () => {
        dispatch({
            type: "AsynchSchedul/getAsynchSchedulList",
            payload: {
                id: 123
            }
        }).then(res => {
            console.log(res);
        })
    }
},

在这里插入图片描述
这里 我们监听屏幕变化 window中的onresize事件
然后 我们拖动F12 改变界面宽度 这样 这个事件就会一直触发去请求
在这里插入图片描述
但是 其实我不建议大家这样去写 因为多次请求性能不好 很容易程序崩溃
但操作一下基本数据 或者特殊需求 就需要你调 接口 那也可以这样去写

我们也可以改成这样

subscriptions: {
     setup({ dispatch, history }) {
        history.listen((location) =>{
            console.log(location);
        })
    },
    
},

运行结果如下
在这里插入图片描述
老实说 个人感觉这个东西作用并不大 有点鸡肋 知道有这么个东西就好了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/62832.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

opencv基础-29 Otsu 处理(图像分割)

Otsu 处理 Otsu 处理是一种用于图像分割的方法,旨在自动找到一个阈值,将图像分成两个类别:前景和背景。这种方法最初由日本学者大津展之(Nobuyuki Otsu)在 1979 年提出 在 Otsu 处理中,我们通过最小化类别内…

11. Redis基础知识

文章目录 一、概述二、数据类型STRINGLISTSETHASHZSET 三、数据结构字典跳跃表 四、使用场景计数器缓存查找表消息队列会话缓存分布式锁实现其它 五、Redis 与 Memcached数据类型数据持久化分布式内存管理机制 六、键的过期时间七、数据淘汰策略八、持久化RDB 持久化AOF 持久化…

AcWing 379. 捉迷藏(最小路径点覆盖匈牙利算法)

输入样例&#xff1a; 7 5 1 2 3 2 2 4 4 5 4 6输出样例&#xff1a; 3 #include<bits/stdc.h> using namespace std; typedef long long ll; const int N220; int n,m,t; int d[N][N],vis[N]; int match[N]; bool find(int x){for(int i1;i<n;i){if(d[x][i]&&…

react icon ant简单使用

refer&#xff1a; 文字提示 Tooltip - Ant Design 1.首先保证已经引入了Ant 2.在组件&#xff08;页面&#xff09;引入tooltip import { Form, Tooltip } from antd; 3.在合适的位置使用tooltip&#xff1a; <span>寿命 <Tooltip title"这是寿命的说明&quo…

java.lang.UnsupportedClassVersionError TestCase

JavaFramework-JDK6.jar 放到JDK17运行没有问题 JavaFramework源码放到JDK17环境下编译出来的JavaFramework-JDK17.jar JavaFramework-JDK17.jar 放到JDK17运行没有问题 JavaFramework-JDK17.jar 放到JDK8运行没有问题&#xff0c;这个好像不对啊&#xff0c;可能之前编译设置…

数组根据属性去重

利用reduce函数处理&#xff0c;直接上代码&#xff01; let data [{name:晓明,id:1},{name:德华,id:2},{name:德华,id:2},{name:晓明,id:1},] var obj {}; let arr data.reduce(function (item, next) {obj[next.id] ? : obj[next.id] true && item.push(next)…

Unity CanvasGroup组件

文章目录 1. 简介2. 组件属性2.1 Alpha(透明度)2.2 Interactable(是否为可交互)2.3 Blocks Raycasts(是否接受射线监测)2.4 Ignore Parent Groups(忽视上层的画布组带来的影响) 1. 简介 CanvasGroup(画布组) 组件&#xff0c;可集中控制整组 UI 元素(自身和所有子物体)的某些属…

ansible安装及rhel8仓库配置

目录 一、本地仓库 问题&#xff1a; 解决&#xff1a; 1.创建一个仓库&#xff1a; 内容&#xff1a; 2.挂载&#xff1a; 挂载&#xff1a; 测试&#xff1a; 3.或者直接使用阿里云的源 二.配置ansible仓库 1.下载&#xff1a; 2.检查 一、本地仓库 问题&#xff1a; 当…

Jmeter-获取接口响应头(Response headers)信息进行关联

文章目录 Jmeter-获取接口响应头&#xff08;Response headers&#xff09;信息进行关联使用正则表达式提取器将Set-Cookie的值提取出来在其余接口中关联该提取信息运行查看关联是否成功 Jmeter-获取接口响应头&#xff08;Response headers&#xff09;信息进行关联 获取某一…

/lib/x86_64-linux-gnu/libc.so.6: version `GLIBC_2.28‘ not found

某项目中&#xff0c;我要给别人封装一个深度学习算法的SDK接口&#xff0c;运行在RK3588平台上&#xff0c;然后客户给我的交叉编译工具链是 然后我用他们给我的交叉编译工具链报下面的错误&#xff1a; aarch64-buildroot-linux-gnu-gcc --version /data/chw/aarch64/bin/cca…

【雕爷学编程】MicroPython动手做(31)——物联网之Easy IoT 3

1、物联网的诞生 美国计算机巨头微软(Microsoft)创办人、世界首富比尔盖茨&#xff0c;在1995年出版的《未来之路》一书中&#xff0c;提及“物物互联”。1998年麻省理工学院提出&#xff0c;当时被称作EPC系统的物联网构想。2005年11月&#xff0c;国际电信联盟发布《ITU互联网…

Python魔法解析:探索变量类型的丰富多彩世界!

在Python这个魔法般的编程语言中&#xff0c;变量是连接你与计算机世界的神奇桥梁。然而&#xff0c;这些变量并不是单一的&#xff0c;它们有着丰富多彩的类型。无论你是刚刚踏入编程的大门&#xff0c;还是想要深入了解Python的高级特性&#xff0c;本篇博客将带你探索变量的…

【Spring】使用注解的方式获取Bean对象(对象装配)

目录 一、了解对象装配 1、属性注入 1.1、属性注入的优缺点分析 2、setter注入 2.1、setter注入的优缺点分析 3、构造方法注入 3.1、构造方法注入的优缺点 二、Resource注解 三、综合练习 上一个博客中&#xff0c;我们了解了使用注解快速的将对象存储到Spring中&#x…

Stable Diffusion教程(7) - PS安装AI绘画插件教程

配套教程视频&#xff1a;https://v.douyin.com/Uyux9F6/ 1. 前置条件 安装了stable diffusion 还没安装的从知识库安装 阿超的AI绘画知识库 语雀 安装了ps2023 还没安装的从网盘下载Win版 PS 2023【必须win10、11】.rar官方版下载丨最新版下载丨绿色版下载丨APP下载-12…

vue页面布局

布局 用element-plus自带的布局&#xff1b; 左边菜单 用他的Menu 菜单、自带收缩和展开&#xff1b;数据可以接口获取或者写死&#xff1b; 使用的如下操作、把主题和默认打开的index存到缓存中 头部&#xff1b; 简单的先分成左右&#xff1b;再简单的分成左右 1、左…

自然语言处理学习笔记(五)————切分算法

目录 1.切分算法 2.完全切分 3.正向最长匹配 4.逆向最长匹配 5.双向最长匹配 6.速度评测 1.切分算法 词典确定后&#xff0c;句子可能含有很多词典中的词语&#xff0c;他们有可能互相重叠&#xff0c;如何切分需要一些规则。常用规则为&#xff1a;正向匹配算法、逆向匹…

小程序的 weiui的使用以及引入

https://wechat-miniprogram.github.io/weui/docs/quickstart.html 网址 1.点进去&#xff0c;在app.json里面配置 在你需要的 页面的 json里面配置&#xff0c;按需引入 然后看文档&#xff0c;再在你的 wxml里面使用就好了

MYSQL06高级_为什么使用索引、优缺点、索引的设计、方案、聚簇索引、联合索引

文章目录 ①. 为什么使用索引②. 索引及其优缺点③. InnoDb - 索引的设计④. InnoDb中的索引方案⑤. 索引 - 聚簇索引⑥. 索引 - 二级索引 ①. 为什么使用索引 ①. 索引是存储引擎用于快速找到数据记录的一种数据结构,就好比去图书馆找书,或者新华字典里找字,相当于一个目录,可…

Vue2 第十七节 Vue中的Ajax

1.Vue脚手架配置代理 2.vue-resource 一.Vue脚手架配置代理 1.1 使用Ajax库 -- axios ① 安装 : npm i axios ② 引入: import axios from axios ③ 使用示例 1.2 解决开发环境Ajax跨域问题 跨域&#xff1a;违背了同源策略&#xff0c;同源策略规定协议名&#xff0…

ApplicationContent 和BeanFactory的关系

选中这个类&#xff0c; ctrl alt u 从springboot的启动类说起 我们知道这个启动类返回值呢是哟个configurableApplicationContent 类型 我们查看她的类图 从图中我们可以看出&#xff0c;configurableApplicationContent是见解的继承了BeanFactory接口&#xff0c;扩展了他…