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. 资源文件, ...
随机推荐
- python基础(输出、变量、常量、数据类型、流程控制)
输出 print print("Hello World!") # python2 和 python3 的区别 # python2 # coding:utf-8 print 123 ...
- Django高级实战 开发企业级问答网站
Django高级实战 开发企业级问答网站 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的感受,单论单个知识点课程本身没问题,大家看的 ...
- centos6.5 zabbix2.2 亲测安装
因为需要做测试,调试.需要安装zabbix. 然后自己新弄了一个 centos6.5 minimal版本,从头来了一遍. 1.先安装LAMP的环境还有一些基本环境. yum -y install g ...
- Leetcode55. Jump Game跳跃游戏
给定一个非负整数数组,你最初位于数组的第一个位置. 数组中的每个元素代表你在该位置可以跳跃的最大长度. 判断你是否能够到达最后一个位置. 示例 1: 输入: [2,3,1,1,4] 输出: true ...
- BZOJ 3296: [USACO2011 Open] Learning Languages
Time Limit: 5 Sec Memory Limit: 128 MB Submit: 387 Solved: 206 [Submit][Status][Discuss] Description ...
- NLTK的探索
import nltk import random from nltk.corpus import movie_reviews documents = [(list(movie_reviews.wor ...
- selenium 常见问题之 nknown error: call function result missing ‘value’
运行时候出现错误提示如下: 出现该问题原因:chrome浏览器自动升级.导致和chromedriver支持的版本不匹配. 解决方案有两种(本人采用的是第一种方式解决办法.): 1.下载和当前使用的ch ...
- 【纯手工】整理豆瓣热点推荐列表-财经&自我管理
[纯手工]整理豆瓣热点推荐列表-财经&自我管理 简七君 2013-10-27 09:40:06 豆瓣君的首页热点推荐实在难以捉摸,只有正好跳出推荐贴时才能按图索骥找列表.简七和小伙伴 ...
- 合唱队形 ( 双向LIS )
#include <iostream> #include <stdio.h> #include <algorithm> using namespace std; ] ...
- 怎么使用mysqlreplicate快速搭建MySQL主从呢?
用其中的mysqlreplicate工具来快速搭建MySQL主从环境. HE1:192.168.1.248 slave HE3:192.168.1.250 master 实战 Part1:安装mysq ...