javascript - 使用 typescript react useTable 钩子(Hook)

标签 javascript reactjs typescript react-table react-table-v7

所以我有一个带有 useTable 的 JavaScript 类。
在 Java 脚本中,它的使用如下

import {useTable, useFilters,useAsyncDebounce,useSortBy,usePagination,} from "react-table";

const {getTableProps,getTableBodyProps, headerGroups, page,prepareRow,state,visibleColumns, nextPage,pageOptions,pageCount,previousPage,canPreviousPage,canNextPage,setPageSize,gotoPage
      } = useTable({columns,data,defaultColumn,filterTypes,initialState: { pageSize: 10, pageIndex: 0 }
       },useFilters, useSortBy,usePagination);
我正在将我的 javascript 项目转换为 typescript 。
useTable 的 typescript 中行给出错误。
示例:Property 'page' does not exist on type 'TableInstance<object>'.ts(2339) enter image description here
initialState属性给出了我的以下错误
Type '{ pageSize: number; pageIndex: number; }' is not assignable to type 'Partial<TableState<object>>'.
  Object literal may only specify known properties, and 'pageSize' does not exist in type 'Partial<TableState<object>>'.ts(2322)
index.d.ts(172, 5): The expected type comes from property 'initialState' which is declared here on type 'TableOptions<object>'
怎么写 useTable typescript 中的行?

最佳答案

使用 react-table 插件扩展,如 usePagination使用 typescript 需要声明插件的类型。
这是通过创建 react-table-config.d.ts 来完成的。或类似的并声明您将使用的插件(或所有插件)的类型。
此处对此进行了描述:https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react-table

关于javascript - 使用 typescript react useTable 钩子(Hook),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66182277/

相关文章:

typescript 错误取决于 react-select 中联合类型中的类型顺序

javascript - 理解 Function.prototype.apply

javascript - 如何从 React-Router-Dom 停止对 Link 元素的传播?

javascript - 如何测试抛出异常?

javascript - React Redux 组件不会在状态更改时重新渲染

javascript - 如何检测 HTML 元素是否是 React 组件的根?

angular 2 Observable完成未调用

javascript - 使用正则表达式查找文本字符串中以 'www' 开头并以 'file-path' 结尾的 URL

javascript - 替换任何字符的正则表达式(除了数字/,.)

javascript - 如何在以下代码中添加 setTimeout 以延迟淡入淡出的动画?