当前位置: 首页 > news >正文

componentDidMount只执行一次的解决方法

一、前言

最近写react antd前端项目,需要页面加载时调用下查询列表的接口。

于是在componentDidMount方法里这样写了:

  componentDidMount() {const {dispatch,MyJS: { queryPara },} = this.props;//这个调用接口查询列表dispatch({ type: 'MyJS/fetch', queryPara });}

之后,当首次打开这个页面时,确实可以查询到数据列表;

但是关闭这个页面后再次打开,就发现没有数据了,componentDidMount没有执行。

二、解决方法

1.由于关闭页面时,没有销毁这个页面,因此再次打开这个页面,页面不会重新加载,就不会调用componentDidMount方法。

2.因此,可以在引入页面的标签中,加上destroyOnClose,样例如下:

        <Drawerwidth={1200}title="选择列表"placement="right"closable={false}onClose={this.onClose1}visible={visible1}destroyOnClose><Mypage onClose={this.onClose1} /></Drawer>

说明:
(1)Drawer标签是import { Drawer } from 'antd';
(2)closable={false}是样式,false时右上角没有关闭按钮,true时有。
(3)visible控制这个子页面打开或者关闭
(4)加上destroyOnClose,就可以当页面关闭后,销毁页面,下次再打开页面就能触发componentDidMount方法了。(如果需要缓存页面、不需要销毁,那就去掉这个)
(5)Mypage标签是自己写的一个页面,import Mypage from './mypage/index';
(6)onColse是页面被关闭时会调用的方法

相关文章:

componentDidMount只执行一次的解决方法

一、前言 最近写react antd前端项目&#xff0c;需要页面加载时调用下查询列表的接口。 于是在componentDidMount方法里这样写了&#xff1a; componentDidMount() {const {dispatch,MyJS: { queryPara },} this.props;//这个调用接口查询列表dispatch({ type: MyJS/fetch, …...

React之diff原理

一、是什么 跟Vue一致&#xff0c;React通过引入Virtual DOM的概念&#xff0c;极大地避免无效的Dom操作&#xff0c;使我们的页面的构建效率提到了极大的提升 而diff算法就是更高效地通过对比新旧Virtual DOM来找出真正的Dom变化之处 传统diff算法通过循环递归对节点进行依…...

ElasticSearch中关于Nasted嵌套查询的介绍:生动案例,通俗易懂,彻底吸收

题注&#xff1a;随着对ES接触的越来越深入&#xff0c;发现此前了解的ES知识点有点单薄&#xff0c;特此寻来ES知识点汇总成的一个思维导图&#xff0c;全面了解自己掌握了哪些&#xff0c;未掌握哪些。此外&#xff0c;作者斌并没有足够的精力学习ES全部的知识点&#xff0c;…...

系列二、Spring的优缺点是什么

一、Spring的优缺点是什么 1.1、优点 集中管理对象&#xff0c;降低对象和对象之间的耦合性&#xff0c;方便维护对象&#xff1b;在不修改代码的情况下可以对业务代码进行增强&#xff0c;减少重复代码&#xff0c;提高开发效率&#xff0c;方便维护&#xff1b;提高开发效率…...

ESP32网络开发实例-HTTP-GET请求

HTTP-GET请求 文章目录 HTTP-GET请求1、HTTP GET请求2、软件准备3、硬件准备4、代码实现4.1 向OpenWeatherMap请求天气数据4.2 ThingSpeak 中的 ESP32 HTTP GET(更新值)在本文中,我们将介绍如使用ESP32向 ThingSpeak 和 openweathermap.org 等常用 API 发出 HTTP GET 请求。…...

PHP:json_encode和json_decode用法

json_encode 函数用于将 PHP 数据结构转换为 JSON 字符串。json_decode 函数用于将 JSON 字符串转换为 PHP 数据结构。 // 将 PHP 数据结构转换为 JSON 字符串 $data ["name" > "John","age" > 25,"city" > "New York&…...

Kafka-Java二:Spring配置kafka消息发送端的缓冲区

一、涉及到的组件概念 1.1、缓冲区 1.2、本地线程 1.3.本地线程消息推送策略 二、各组件的解释参见代码注释 // 配置消息的缓冲区/** 设置消息发送者端的缓冲区大小&#xff0c;如果设置了缓冲区&#xff0c;消息会先发送到缓冲区&#xff0c;可以提供发送性能* 默认大小是32…...

【ArcGIS模型构建器】05:批量为多个矢量数据添加相同的字段

本文实现借助arcgis模型构建器,实现批量为多个土地利用矢量数据添加相同的字段,例如DLMC,DLTB等。 文章目录 问题分析模型构建问题分析 有多个土地利用数据矢量图层,每个图层中有很多个图斑,现在需要给每个图层添加一个或者多个字段,如DLCM,DLBM等。 属性表如下所示: …...

坤坤的悲伤生活

描述 坤坤&#xff0c;这几个月来都非常悲伤&#xff0c;因为自己事发了&#xff0c;有一些问题找上了门&#xff0c;这个时候&#xff0c;有个人进献了一个阿拉丁神灯&#xff0c;有个灯神能够解决掉这个问题&#xff0c;但是有前提&#xff0c;必须回答出它的问题&#xff0c…...

职业技术认证:《研发效能(DevOps)工程师》——开启职业发展新篇章

在互联网行业中&#xff0c;资质认证可以证明在该领域内的专业能力和知识水平。各种技术水平认证也是层出不穷&#xff0c;而考取具有公信力和权威性的认证是从业者的首选。同时&#xff0c;随着国内企业技术实力的提升和国家对于自主可控的重视程度不断提高&#xff0c;国产证…...

gin 框架出现runtime error: index out of range [0] with length 0

之前是这样的&#xff1a; category : c.Request.Form["type"][0] 加上这一句就变成了 fmt.Println(c.Request.FormFile("type")) category : c.Request.Form["type"][0]...

【高阶数据结构】B树

目录 1.B树 2.B树和B树的不同 3.B*树 B树较于哈希红黑树的优势&#xff1a;外查找&#xff1a;读取磁盘数据 &#xff1b; B树的高度更低&#xff0c;对磁盘的进行I/O操作的次数更少&#xff08;磁盘的性能比内存差得多&#xff09;&#xff1b; 1.B树 1.1.B树的概念&am…...

Android-Framework 应用间跳转时,提供 Android Broadcast 通知

一、环境 高通865 Android 10 二、情景 应用跳转时,通过广播发送源app的包名和目标app的包名 三、代码实现 frameworks/base/services/core/java/com/android/server/wm/ActivityStarter.java -132,6 132,14 import java.io.PrintWriter;import java.text.DateFormat;imp…...

【Javascript】函数返回值的作用

目录 返回值 中断函数 只能写在函数体里面 返回值 function a(){var b3;return b3? 4:5;} console.log(a()); 创建一个函数&#xff0c;给b赋值3&#xff0c; return b3? 4:5; 判断b是不是等于3&#xff0c;如果是就返回4&#xff0c; 如果不是就返回5 中断函数…...

蓝桥杯 Java k倍区间

前缀和的一个神奇算法&#xff0c;这道题暴力是遍历前缀和的差&#xff0c;也就是遍历所有区间和看他是不是能不能正好除尽k 这道题的技巧是将所有前缀和和k求余 按照求余的结果放在一个数组中 那么余数为0的前缀和a一定满足要求&#xff08;[0,a]&#xff09; 余数相同的两两…...

万宾科技亮相2023中国传感器与应用技术大会,创始人CEO发表演讲

10月25日-26日&#xff0c;由厦门市工业和信息化局指导;中国传感器与物联网产业联盟、厦门火炬高技术产业开发区管理委员会主办的2023中国(厦门)传感器与应用技术大会暨展览会在厦门召开。本次展会聚焦传感器与储能、物联网、海洋、智慧生活、城市安全与基础设施的融合&#xf…...

#力扣:LCP 06. 拿硬币@FDDL

LCP 06. 拿硬币 - 力扣&#xff08;LeetCode&#xff09; 一、Java class Solution {public int minCount(int[] coins) {int ans0;for(int i0;i<coins.length;i)ans(coins[i]1)/2;return ans;} }...

【Node.js】暴露自定义响应头和预检请求的时机

1. 暴露自定义响应头 // server.js app.post(/api/user/hello, (req, res) > {res.setHeader(Access-Control-Allow-Origin, *)// 权限设置&#xff08;如果有个多&#xff0c;用 &#xff0c;隔开&#xff09;&#xff0c;暴露给前端res.setHeader(Access-Control-expose-…...

包管理工具与配置文件package.json

1&#xff0c;了解工程化管理核心 1.1 nodejs 理解&#xff1a; 在前端工程化发展中&#xff0c;nodejs的出现让前端开始了工程化&#xff0c;结束了仅静态页和切图的工作。他为前端提供了一个运行环境&#xff0c;让前端彻底变成了一个单独的工程&#xff0c;可以运行、编译…...

uni-app:解决异步请求返回值问题

可以使用 Promise 或者回调函数来处理异步请求的返回值。 方法一&#xff1a; Promise处理异步请求的返回值 使用 Promise 可以将异步请求的结果通过 resolve 和 reject 返回&#xff0c;然后通过 .then() 方法获取成功的结果&#xff0c;通过 .catch() 方法获取错误信息。 …...

python打卡day49

知识点回顾&#xff1a; 通道注意力模块复习空间注意力模块CBAM的定义 作业&#xff1a;尝试对今天的模型检查参数数目&#xff0c;并用tensorboard查看训练过程 import torch import torch.nn as nn# 定义通道注意力 class ChannelAttention(nn.Module):def __init__(self,…...

从零实现富文本编辑器#5-编辑器选区模型的状态结构表达

先前我们总结了浏览器选区模型的交互策略&#xff0c;并且实现了基本的选区操作&#xff0c;还调研了自绘选区的实现。那么相对的&#xff0c;我们还需要设计编辑器的选区表达&#xff0c;也可以称为模型选区。编辑器中应用变更时的操作范围&#xff0c;就是以模型选区为基准来…...

(二)TensorRT-LLM | 模型导出(v0.20.0rc3)

0. 概述 上一节 对安装和使用有个基本介绍。根据这个 issue 的描述&#xff0c;后续 TensorRT-LLM 团队可能更专注于更新和维护 pytorch backend。但 tensorrt backend 作为先前一直开发的工作&#xff0c;其中包含了大量可以学习的地方。本文主要看看它导出模型的部分&#x…...

汽车生产虚拟实训中的技能提升与生产优化​

在制造业蓬勃发展的大背景下&#xff0c;虚拟教学实训宛如一颗璀璨的新星&#xff0c;正发挥着不可或缺且日益凸显的关键作用&#xff0c;源源不断地为企业的稳健前行与创新发展注入磅礴强大的动力。就以汽车制造企业这一极具代表性的行业主体为例&#xff0c;汽车生产线上各类…...

css的定位(position)详解:相对定位 绝对定位 固定定位

在 CSS 中&#xff0c;元素的定位通过 position 属性控制&#xff0c;共有 5 种定位模式&#xff1a;static&#xff08;静态定位&#xff09;、relative&#xff08;相对定位&#xff09;、absolute&#xff08;绝对定位&#xff09;、fixed&#xff08;固定定位&#xff09;和…...

Java 二维码

Java 二维码 **技术&#xff1a;**谷歌 ZXing 实现 首先添加依赖 <!-- 二维码依赖 --><dependency><groupId>com.google.zxing</groupId><artifactId>core</artifactId><version>3.5.1</version></dependency><de…...

[免费]微信小程序问卷调查系统(SpringBoot后端+Vue管理端)【论文+源码+SQL脚本】

大家好&#xff0c;我是java1234_小锋老师&#xff0c;看到一个不错的微信小程序问卷调查系统(SpringBoot后端Vue管理端)【论文源码SQL脚本】&#xff0c;分享下哈。 项目视频演示 【免费】微信小程序问卷调查系统(SpringBoot后端Vue管理端) Java毕业设计_哔哩哔哩_bilibili 项…...

Scrapy-Redis分布式爬虫架构的可扩展性与容错性增强:基于微服务与容器化的解决方案

在大数据时代&#xff0c;海量数据的采集与处理成为企业和研究机构获取信息的关键环节。Scrapy-Redis作为一种经典的分布式爬虫架构&#xff0c;在处理大规模数据抓取任务时展现出强大的能力。然而&#xff0c;随着业务规模的不断扩大和数据抓取需求的日益复杂&#xff0c;传统…...

负载均衡器》》LVS、Nginx、HAproxy 区别

虚拟主机 先4&#xff0c;后7...

【记录坑点问题】IDEA运行:maven-resources-production:XX: OOM: Java heap space

问题&#xff1a;IDEA出现maven-resources-production:operation-service: java.lang.OutOfMemoryError: Java heap space 解决方案&#xff1a;将编译的堆内存增加一点 位置&#xff1a;设置setting-》构建菜单build-》编译器Complier...