分页 - 类型“void”不可分配给类型“PageEvent”

Posted

技术标签:

【中文标题】分页 - 类型“void”不可分配给类型“PageEvent”【英文标题】:Pagination - Type 'void' is not assignable to type 'PageEvent' 【发布时间】:2022-01-22 17:59:05 【问题描述】:

我正在尝试使用垫子分页器但没有表格创建分页。我现在的问题是我收到错误类型“void”不能分配给我的分页方法的类型“PageEvent”。

这就是我得到的:

html

<mat-paginator 
  [length]="length"
  [pageSize]="pageSize"
  [pageSizeOptions]="pageSizeOptions"
  (page)="pageEvent = OnPageChange($event)"> //Here comes the error
</mat-paginator>

打字稿:

//Definitions
//Paginator
length = 100;
pageSize = 10;
pageSizeOptions: number[] = [5, 10, 25, 100];
// MatPaginator Output
pageEvent: PageEvent;
@ViewChild(MatPaginator) paginator: MatPaginator;

//My Method for change pages:
OnPageChange(event: PageEvent)
  let startIndex = event.pageIndex * event.pageSize;
  let endIndex = startIndex + event.pageSize;
  if(endIndex > this.length)
    endIndex = this.length;
  
  this.pagedList = this.identFiltered.slice(startIndex, endIndex); //identFiltered is my Datasource

好像pageEvent的定义是错误的,但我暂时不确定

【问题讨论】:

【参考方案1】:

那么让我们看看抛出错误的那一行:

(page)="pageEvent = OnPageChange($event)"

代码意味着每当page 输出发出事件时,将OnPageChange($event) 的返回值分配给pageEvent 变量。

您遇到的问题是您的函数OnPageChange($event: PageEvent) 没有返回任何内容。因此,您的函数没有返回值,这就是它的void 的原因。

要解决您的问题,请在 OnPageChange 中返回 $event,以便它返回 PageEvent,或者干脆不要尝试在 HTML 中将事件分配给 pageEvent 并将其移至您的函数。

【讨论】:

以上是关于分页 - 类型“void”不可分配给类型“PageEvent”的主要内容,如果未能解决你的问题,请参考以下文章

错误:类型“void”不可分配给类型“ReactNode”

使用反应成帧器类型'()=> void'的打字稿错误不可分配给类型'未定义'

React 错误:类型“void”不可分配给 React.Component 中的类型“Readonly<>”

Promise 回调参数类型不可分配给 '(value: unknown) => void | PromiseLike<void>'

如何修复类型 'AsymmetricMatcher<any>' 不可分配给类型 '() => void'。在茉莉花/开玩笑

类型'void'不可分配给类型'FormData'。