react+antd 点击分页为上次操作结果
最近项目中在使用antd的分页组件时发生了第一次点击分页无变化,再次点击时数据为上一次的分页结果,代码如下:
setPageIndex = (pagination)=> {
const pager = { ...this.state.pagination };
pager.current = pagination.current;
this.setState({
pagination: pager, // 设置当前页
});
this.getList(); // 获取数据列表
}
在确认代码无误之后查阅react相关资料发现 :
通过this.setState({}) 进行赋值时不能保证是同步进行的。
于是通过修改代码使用asnyc + await 规避掉此问题:
setPageIndex = async (pagination)=> {
const pager = { ...this.state.pagination };
pager.current = pagination.current;
await this.setState({
pagination: pager, // 设置当前页
});
this.getList(); // 获取数据列表
}
react+antd 点击分页为上次操作结果的更多相关文章
- webpack+react+antd 单页面应用实例
React框架已经火了好长一段时间了,再不学就out了! 对React还没有了解的同学可以看看我之前的一篇文章,可以快速简单的认识一下React.React入门最好的实例-TodoList 自己从开始 ...
- react antd 关于selectedRows 的问题
在table中,经常会用到单选和多选的功.这里会有一个方法, 当触发onchange的时候回有两个数组,[selectedRowKeys, selectedRows],当前选中的keys和每一项, 这 ...
- React antd如何实现<Upload>组件上传附件再次上传已清除附件缓存问题。
最近在公司做React+antd的项目,遇到一个上传组件的问题,即上传附件成功后,文件展示处仍然还有之前上传附件的缓存信息,需要解决的问题是,要把上一次上传的附件缓存在上传成功或者取消后,可以进行清除 ...
- 基于webpack+react+antd 项目构建
工欲善其事必先利其器,学习React也是如此. 下面分享一篇基于webpack+react+antd 项目构建的好文章, https://blog.hduzplus.xyz/articles/2017 ...
- 获取列表数据时,getList 设置默认参数:getList(page = 1),点击分页及前往时,传page参数,其他使用page的默认值:1
获取列表数据时,getList 设置默认参数:getList(page = 1),点击分页及前往时,传page参数,其他使用page的默认值:1
- 用js或JQuery模拟点击a标签的操作
一.用js模拟点击a标签的操作. jsp代码: <a id="login" href="${pageContext.request.contextPath}/log ...
- element-ui table 点击分页table滚动到顶部
在做项目中,碰到一个问题,table加了固定头,内容可滚动,当滚到table底边时,点击分页后还在底边 解决方法:设置table的 ref='multipleTable' //切换分页的方法加上下面这 ...
- solr深分页,游标操作分页,解决性能问题
solr深分页,游标操作分页,解决性能问题 @Test public void pageByCursor() { try { solrServer.connect(); String query = ...
- React+Antd遇到的坑
第一次尝试React+antd,发现果然不愧是传说中的坑货,一个又一个坑.必须要记录. react + antd,都是最新版本,使用npm和yarn各种add,build,start 1. 资源文件, ...
随机推荐
- CSS:你真的懂margin吗?
你真的了解margin吗?你知道margin有什么特性吗?你知道什么是垂直外边距合并? margin在块元素.内联元素中的区别?什么时候该用padding而不是margin?你知道负margin吗?你 ...
- matplotlib无法显示中文
import matplotlib as mpl mpl.rcParams['font.sans-serif'] = ['KaiTi']mpl.rcParams['font.serif'] = ['K ...
- IO 性能 $ iostat -kx 2$ vmstat 2 10$ mpstat 2 10$ dstat --top-io --top-bio
这些命令对于调试后端性能非常有用. 检查磁盘使用量:服务器硬盘是否已满? 是否开启了swap交换模式 (si/so)? CPU被谁占用:系统进程? 用户进程? 虚拟机? dstat 是我的最爱.用 ...
- Leetcode671.Second Minimum Node In a Binary Tree二叉树中的第二小结点
给定一个非空特殊的二叉树,每个节点都是正数,并且每个节点的子节点数量只能为 2 或 0.如果一个节点有两个子节点的话,那么这个节点的值不大于它的子节点的值. 给出这样的一个二叉树,你需要输出所有节点中 ...
- ACdream 1007 (快速幂)
题目链接 a + b Time Limit: 2000/1000MS (Java/Others)Memory Limit: 128000/64000KB (Java/Others) Problem D ...
- CISC和RISC是什么?它们的特点和区别?
CISC的英文全称为“Complex Instruction Set Computer”,即“复杂指令系统计算机”,从计算机诞生以来,人们一直沿用CISC指令集方式.早期的桌面软件是按CISC设计的, ...
- 地不安装Oracle,plsql远程连接数据库
由于Oracle的庞大,有时候我们需要在只安装Oracle客户端如plsql.toad等的情况下去连接远程数据库,可是没有安装Oracle就没有一切的配置文件去支持.最后终于发现一个很有效的方法,Or ...
- POJ1485 Sumdiv
Sumdiv Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 22680 Accepted: 5660 Descripti ...
- Gradle中的buildScript,gradle wrapper,dependencies等一些基础知识
就想收藏一篇好文,哈哈,无他 Gradle中的buildScript代码块 - 黄博文 然后记录一些gradle的基础知识: 1.gradle wrapper就是对gradle的封装,可以理解为项目内 ...
- 新一代互联网传输协议QUIC浅析
QUIC(Quick UDP Internet Connection)是谷歌制定的一种互联网传输层协议,它基于UDP传输层协议,同时兼具TCP.TLS.HTTP/2等协议的可靠性与安全性,可以有效减少 ...