分页在react js中不起作用，因为我不知道应该传递哪个参数
在React.js中实现分页功能需要传递两个参数：当前页码和每页显示的数据量。
首先，你需要定义一个状态变量来保存当前页码，例如currentPage。然后，在组件渲染时，你可以将这个currentPage作为参数传递给后端接口，请求相应的数据。同时，你需要定义另一个状态变量来保存每页显示的数据量，例如pageSize。可以通过调整pageSize的值来控制每页显示的数据量。
接下来，你需要在组件中创建一个分页组件，用于展示分页效果和处理分页事件。在分页组件中，你可以通过计算总页数来展示页码按钮。可以通过对总数据量除以每页显示的数据量来计算总页数。同时，你可以监听页码按钮的点击事件，在点击事件处理函数中更新currentPage的值，并重新请求数据。
为了更好地实现分页功能，你可以使用React Router库来实现路由导航，使每次页码变化时，URL也跟随变化。这样可以实现通过URL直接访问某一页的功能。
在React.js中，你可以使用axios库或者fetch API来发起网络请求获取数据。可以在组件的生命周期函数中调用这些网络请求方法，并将currentPage和pageSize作为参数传递给后端接口。
总结起来，在React.js中实现分页功能需要以下步骤：
- 定义当前页码的状态变量，如currentPage。
- 定义每页显示的数据量的状态变量，如pageSize。
- 创建分页组件，展示分页效果和处理分页事件。
- 计算总页数并展示页码按钮。
- 监听页码按钮的点击事件，更新currentPage的值，并重新请求数据。
- 使用React Router实现页面导航，使每次页码变化时，URL也跟随变化。
- 使用axios库或fetch API发起网络请求，将currentPage和pageSize作为参数传递给后端接口。
作为一个云计算领域的专家，我推荐使用腾讯云的云开发服务，该服务提供了前后端一体化的开发框架和工具链，简化了分页功能的实现过程。你可以了解更多关于腾讯云云开发的信息，请访问腾讯云云开发官网：https://cloud.tencent.com/product/tcb
相关·内容
嗨，我正在尝试从Bootstrap实现分页。我基本上是在调用一个API来从后端获取数据-- await API.get("categories?offset=“+ pno)。现在我从代码的分页部分传递它： let activePage = this.state.pdata.currPage;
let totalPages谁能告诉我应该在参数
浏览 19提问于2020-01-29得票数 0
我在我的页面上有多个存储来加载extjs网格中的数据。我正在使用一个js函数来加载这些存储。根据搜索按钮单击事件，我将相应的商店附加到网格。它工作得很好。在load函数中，我有很多参数需要发送到后端，以获取结果并显示在网格中。现在有了分页。是否可以在分页中添加js函数调用，以便传递</
浏览 2提问于2012-06-29得票数 0
我在我的web应用程序中使用redux persist来存储localStorage中的数据，但redux在页面重新加载时丢失了数据。有没有人有同样的问题或者谁能帮我解决这个问题。我的redux-persist初始化是：import userData from ".createStore(persistedReducer);
export const persistor = per
浏览 13提问于2021-10-01得票数 0
我有一个图像链接，当我点击它时，我想在一些类变量中做一些更改，然后重定向到其他页面并使用这些值。下面是我的代码，我使用StatefulSnippet selectedStudent = student }
但是
浏览 0提问于2012-08-31得票数 2
回答已采纳
下面是我的代码，用于在React本机中生成分页滚动视图： horizontal我认为在x或y中使用简单的数学值
浏览 2提问于2018-09-29得票数 3
回答已采纳
4回答
我想使用分页搜索结果。因此，我将数据传递给一个分页器实例： new Zend_Paginator_Adapter_DbSelect这一切工作很好，我得到正确的数据和分页链接显示。mysite.de/home&
浏览 0提问于2011-03-30得票数 2
回答已采纳
1回答
context={'request': request})我已经实现了游标分页，我也得到了响应。在{{BaseUrl}}channel/getmessages/GeneralChannel/中，我们可以通过参数it来操作响应，比如?page=1或2，但是在游标分页</em
浏览 5提问于2022-08-13得票数 0
回答已采纳
1回答
我开始使用react.js并创建一个组件盒，state = {pageNumber: 1, dataForTable:''}。我在其中插入两个组件-分页和表。当点击分页时，它会给出页数到框。方框状态更改，然后它呈现，然后分页呈现也。然后我将ajax设置为server，为表获取新数据，然后第二次使用Box呈现来呈现Tables。
我应该把ajax逻辑放在哪个函数中
浏览 2提问于2015-01-23得票数 0
回答已采纳
我正在使用react- function(evaluating(_reactApollo.connect)(mapQueriesToProps))客户端和ApolloProvider将我的组件与queryprops函数连接起来以呈现数据，但是我得到了这个错误: undefined is not a querypropsimport React, { Component } from 'react';
import{ connect, gql, graphql } from &#x
浏览 0提问于2017-09-15得票数 0
1回答
应该使用超出范围的分页查询(例如，10中的11 )生成404?我正在处理一个React.js应用程序，在那里我们暂时延迟了堆栈的同构重新工作。Rails后端交付应用程序，React.js前端对分页结果的搜索API进行前端调用。常识SEO智慧说，这是不好的，因为
浏览 0提问于2017-01-17得票数 2
回答已采纳
我在一个视图控制器上有两个UITableViews (视图控制器是它们的代理)。其中之一将依赖于scrollViewWillEndDragging:withVelocity:targetContentOffset：(我想进行某种自定义分页)。我是否需要尝试创建另一个委托(不使用该方法)，并使用分页委托将其设置为UITableView，或者我只是不需要担心？
浏览 7提问于2012-09-07得票数 1
回答已采纳
行()方法可以采用参数"options"，该参数可用于分页。'maxResults' => 3, ];现在，我想要的是在bigquery查询结果行()方法中使用分页。rows()还以选项作为参数。(但它没有给出选项中应该包含<
浏览 2提问于2017-03-10得票数 2
回答已采纳
3回答
我有一个笔记应用程序，它显示笔记与编辑和删除选项。如何使编辑/删除按钮仅在该注释div上工作？现在，每当我按下编辑/删除时，它只对第一个笔记起作用，而不是对我点击按钮的特定笔记起作用。Display.js： render(){ const displayNotes = notesList.map={this.props.delete}>Delete</button>
</
浏览 4提问于2020-08-22得票数 0
回答已采纳
我按照关于discord.js文档的说明创建了一个动态帮助命令。当我使用//help时，它正常工作，但是//help，例如，不是，我不知道为什么会发生这种情况，我已经尝试了很多方法来解决这个问题，但是没有什么效果。有洞察力吗？代码如下：// nodejs for filesystem// require the di
浏览 2提问于2020-08-02得票数 0
回答已采纳
我有一个web应用程序，它用Google客户端库调用几个API端点。JavaScrit代码： //
浏览 4提问于2016-05-30得票数 1
回答已采纳
我想把分页和过滤结合起来。因为我有很多过滤器，所以我不想在每个GET请求中发送它们，因为URL变得非常丑陋。编辑：
实际上，它应该像stackoverflow用户问题的分页一样工作。如果用户点击一个页面编号，就会显示正确
浏览 1提问于2010-01-05得票数 7
回答已采纳
我需要在JasperReports中开发一个包含一个子报表的报告，但是对于列表parameter.for示例中的每个值，都会重复子报告：MyReport：
传递参数的值3的子报告(Cros
浏览 0提问于2013-06-14得票数 3
2回答
原文：我只使用一个索引文件来显示几乎所有在我的网站上，使用了一大堆包括的文件。但是，我的分页类；仅发布它自己的$_GET参数才能工作。
这就是问题所在；当您按Next、press、1、2、3、无穷大等键时--自然地，页面重新加载--这将移除?view=News，取而代之的是分页器$_GET。哪个..。整件事都搞砸了。象征性地说。理论上，它应该将$derived
浏览 4提问于2013-10-29得票数 0
回答已采纳
我有一个社交RN项目，名为“在你的社区做的比你有一片”的项目，在上为需要的人提供食物
我正在使用React Navigator进行导航和菜单，但是我不知道如何在我的App.js ()中传递参数。我想传递参数，因为我想在抽屉菜单上显示用户的图片。我成功地将道具从主"App“类传递到&q
浏览 0提问于2018-10-21得票数 0
我真的厌倦了逐层传递单个道具，因为我必须逐层添加"propA={this.props.propA}“，如果有新的参数，则逐层添加。或者我应该传递所有的道具，这是我不喜欢的，这意味着要一层一层地传递所有的道具。
第三种方法是在Name组件构造函数本身中获取url参数，然后，一次完成，全部完成。但是，它会得到每个名字初始化作用域中的url参数</em
浏览 0提问于2018-05-28得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
