最近项目中在使用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 点击分页为上次操作结果的更多相关文章

  1. webpack+react+antd 单页面应用实例

    React框架已经火了好长一段时间了,再不学就out了! 对React还没有了解的同学可以看看我之前的一篇文章,可以快速简单的认识一下React.React入门最好的实例-TodoList 自己从开始 ...

  2. react antd 关于selectedRows 的问题

    在table中,经常会用到单选和多选的功.这里会有一个方法, 当触发onchange的时候回有两个数组,[selectedRowKeys, selectedRows],当前选中的keys和每一项, 这 ...

  3. React antd如何实现<Upload>组件上传附件再次上传已清除附件缓存问题。

    最近在公司做React+antd的项目,遇到一个上传组件的问题,即上传附件成功后,文件展示处仍然还有之前上传附件的缓存信息,需要解决的问题是,要把上一次上传的附件缓存在上传成功或者取消后,可以进行清除 ...

  4. 基于webpack+react+antd 项目构建

    工欲善其事必先利其器,学习React也是如此. 下面分享一篇基于webpack+react+antd 项目构建的好文章, https://blog.hduzplus.xyz/articles/2017 ...

  5. 获取列表数据时,getList 设置默认参数:getList(page = 1),点击分页及前往时,传page参数,其他使用page的默认值:1

    获取列表数据时,getList 设置默认参数:getList(page = 1),点击分页及前往时,传page参数,其他使用page的默认值:1

  6. 用js或JQuery模拟点击a标签的操作

    一.用js模拟点击a标签的操作. jsp代码: <a id="login" href="${pageContext.request.contextPath}/log ...

  7. element-ui table 点击分页table滚动到顶部

    在做项目中,碰到一个问题,table加了固定头,内容可滚动,当滚到table底边时,点击分页后还在底边 解决方法:设置table的 ref='multipleTable' //切换分页的方法加上下面这 ...

  8. solr深分页,游标操作分页,解决性能问题

    solr深分页,游标操作分页,解决性能问题 @Test public void pageByCursor() { try { solrServer.connect(); String query = ...

  9. React+Antd遇到的坑

    第一次尝试React+antd,发现果然不愧是传说中的坑货,一个又一个坑.必须要记录. react + antd,都是最新版本,使用npm和yarn各种add,build,start 1. 资源文件, ...

随机推荐

  1. jnhs-SpringMVC的controller向jsp传递数据的五种方式

    参考此文http://blog.sina.com.cn/s/blog_6d3c1ec601014h1h.html 1 使用ModelAndVoew 引入:org.springframework.web ...

  2. 关于Vector CANoe的讨论

    默认排序​ 踩猫尾巴 汽车电子攻城狮 27 人赞同了该回答 好像是很久以前的问题啊,为什么会现在收到邀请. 我觉得 @lijuqqkiko 介绍的足够啦. 我再额外发散一点吧. 目前在CAN总线测试和 ...

  3. farv

    http://weishu.me/ https://github.com/jimupon/VirtualXposed O:  ?  api 26 - vdex N: speed-profile M: ...

  4. LintCode刷题笔记-- Distinct Subsequences

    标签:动态规划 题目描述: Given a string S and a string T, count the number of distinct subsequences of T in S. ...

  5. C# 详解反射

    原博客:http://www.cnblogs.com/Stephenchao/p/4481995.html 两个现实中的例子: 1.B超:大家体检的时候大概都做过B超吧,B超可以透过肚皮探测到你内脏的 ...

  6. 【python小随笔】pycharm的永久破解

    PS:这里有人会遇到第一次输入补丁的破解命令后,重启后启动不了软件,这个时候需要卸载(unstall把配置都得删除了),然后重新下载软件,再用这个步骤就OK了~~版本一定要低于最新版本两个以上,最好用 ...

  7. SpringBoot 使用 @Value 从 YAML文件读取属性

    在 YAML中有如下配置 paypal: mode:live 在类中,通过 @Value属性读取 @Value("${paypal.mode}") private String m ...

  8. 移动HTML5前端框架—MUI

      前  言 JRedu 鉴于之前的很多前端框架(特别是响应式布局的框架),UI控件看起来太像网页,没有原生感觉,因此追求原生UI也是MUI的重要目标.MUI以iOS平台UI为基础,补充部分Andro ...

  9. python ndarray相关操作:转置、翻转

  10. phpcms万能字段的使用方法

    今天想做一个单选的字段,里面要使用别的字段,于是研究了一下万能字段!刚开始使用的时候,在网上,论坛里找了好久,没发现一个贴子有针对万能字段的使用说明,官方的例子里也只有一个调用字段本身值的变量 {FI ...