React + antd 组件离开页面以后出现Can only update a mounted or mounting component 的解决办法
做项目的过程中,来回切换页面时,一直遇到Can only update a mounted or mounting component 这个问题,原因是当离开页面以后,组件已经被卸载,执行setState时无法找到渲染组件。
解决办法特别简单,在离开页面时的周期函数(componentWillUnmount)中:
//组件将被卸载
componentWillUnmount(){
//重写组件的setState方法,直接返回空
this.setState = (state,callback)=>{
return;
};
}
再来回切换页面以后,只要页面离开就会执行该方法,当页面再次进入时又会重新挂载父组件的setState方法,从而不影响页面的渲染。
不过该方法不是很严谨,在集成的子组件中能修改父组件的setState方法,不过在javascript的语法中很适用,建议只在出现上述bug的页面中使用。
React + antd 组件离开页面以后出现Can only update a mounted or mounting component 的解决办法的更多相关文章
- 微信返回上一页,页面中的AJAX的请求,对Get请求无效的解决办法
问题产生原因 最近在做一个微信的项目时,遇到一种很常见的情况,需求是这样的,当用户进入到"我的个人中心"的时候,会有一个点击跳转填写认证资料的按钮,点击此按钮后,会跳转 ...
- aspx在页面跳转(Response.Redirect)时丢失session问题及解决办法
[问题描述] 假设a.aspx.cs页面保存有Session["empid"]="3",当a.aspx.cs通过Response.Redirect(" ...
- WIN7中组件服务中的DCOM配置找不到Microsoft Excel应用程序的解决办法
转自:http://blog.csdn.net/lploveme/article/details/8215265 在运行栏中输入命令:dcomcnfg,打开组件服务管理窗口,但是却发现找不到Micro ...
- vue----子组件引用vux popup mask遮罩在最上层解决办法 z-index问题
在一个页面的子组件中引用vux的popup组件时,出现mask遮罩在最上层的问题,百度了一下发现有两种解决办法,现提供第三种. popup在子组件引用时,vux将vux-popup-mask默认添加到 ...
- webpack+react+antd 单页面应用实例
React框架已经火了好长一段时间了,再不学就out了! 对React还没有了解的同学可以看看我之前的一篇文章,可以快速简单的认识一下React.React入门最好的实例-TodoList 自己从开始 ...
- React antd如何实现<Upload>组件上传附件再次上传已清除附件缓存问题。
最近在公司做React+antd的项目,遇到一个上传组件的问题,即上传附件成功后,文件展示处仍然还有之前上传附件的缓存信息,需要解决的问题是,要把上一次上传的附件缓存在上传成功或者取消后,可以进行清除 ...
- React 蚂蚁金服+ Antd 组件使用技巧
安装antd 组件 yarn add antd -D import { Card,Button,Table,From,Modal ,Select } from 'antd'; .引入就可以使用了 ...
- 从零搭建react+ts组件库(封装antd)
为什么会有这样一篇文章?因为网上的教程/示例只说了怎么做,没有系统详细的介绍引入这些依赖.为什么要这样配置,甚至有些文章还是错的!迫于技术洁癖,我希望更多的开发小伙伴能够真正的理解一个项目搭建各个方面 ...
- 十九、React UI框架Antd(Ant Design)的使用——及react Antd的使用 button组件 Icon组件 Layout组件 DatePicker日期组件
一.Antd(Ant Design)的使用:引入全部Css样式 1.1 antd官网: https://ant.design/docs/react/introduce-cn 1.2 React中使用A ...
随机推荐
- clock gen sdk 代码笔记
int ClockConfig(void) { u32 DIVCLK_DIVIDE = 10; u32 CLKFBOUT_MULT = 53; u32 CLKFBOUT_FRAC = 625; u32 ...
- 2。创建第一个angular应用,已经开发前的一些配置
现在我们开始新建一个angular5的脚手架 . 到想要建项目的目录下.比如我的 在 D:\JsProjects 进入cmd或者powershell cd 进入该文件夹下 然后开始新建,ng ne ...
- hdu2871 区间合并(类似poj3667)+vector应用
用vector进行插入和删除操作! 总是有些地方处理不好,对拍了才知道错在哪里,, /* 给定一些操作 reset 清空 new a ,申请最左边的连续a个空间 free a,清空a所在的块 get ...
- 剑指offer之二叉树
二叉树前序,中序,后序遍历思想 前序遍历:ABDCEFGH 中序遍历:BDAFEHGC 后序遍历:DBFHGECA 科普 队列(queue)是一种常用的数据结构,可以将队列看做是一种特殊的线性表,该结 ...
- pandas之系列操作(一)
1.读Excel: # coding=utf-8 import pandas as pd import pymysql sql_select =" xxxxx " con = py ...
- js中匿名函数和回调函数
匿名函数: 通过这种方式定义的函数:(没有名字的函数) 作用:当它不被赋值给变量单独使用的时候 1.将匿名函数作为参数传递给其他函数 2.定义某个匿名函数来执行某些一次性任务 var f = func ...
- C# 位移运算
一:“<<”和“>>”运算符用于执行移位运算,分别称为左移位运算符和右移位运算符.对于X<<N和X>>N形式的运算,含义是将X向左或向右移动N位,得到的 ...
- 根据现有的XML文件生成其对应的实体类
方法如下: 1.将完整的Xml文本复制一下, 2.在vs2013(或以上版本) .net4.5项目下建立一个类文件, 3.依次选择菜单:编辑->选择性粘贴->将XML粘贴为类.
- 阿里 Goldeneye 四个环节落地智能监控:预测、检测、报警及定位
阿里 Goldeneye 四个环节落地智能监控:预测.检测.报警及定位 https://www.infoq.cn/article/alibaba-goldeneye-four-links
- Ng Alain使用 - cli和克隆两种方式
感觉没啥要写的,但是在查看相关资料的过程中发现不少浮夸的人,可以说是完全不阅读官方文档,操作完全无厘头,,创建了删,配置,再删除,,,扯蛋....., 方式一:CLI(推荐) # 确保使用的是最新版本 ...