Ant Design分页组件中实现禁止点击当前页按钮的方法

这里需要使用到Ant Design分页组件pagination的一个回调函数onChange

Ant Design分页组件中实现禁止点击当前页按钮的方法_第1张图片

 onChange函数用来监听鼠标点击事件,

  它有两个入参==》1. 点击分页按钮时获取到的页码   2. 每页最大显示条数 

所以,禁止点击当前分页按钮的核心逻辑是:

if  {当前页的页码 == onChange点击获取到的页码 }  return

如下面代码所示:

Ant Design分页组件中实现禁止点击当前页按钮的方法_第2张图片

 onPageChange是传递给pagination onChange函数的具体实现,通过父组件传递给子组件

子组件调用时要将额外的当前页参数获取到,然后连同onChange函数自动提供的两个参数,一起传递进来。

Ant Design分页组件中实现禁止点击当前页按钮的方法_第3张图片

以下是子组件中: onPageChange函数的类型定义

Ant Design分页组件中实现禁止点击当前页按钮的方法_第4张图片

你可能感兴趣的:(Ant,Design,javascript)