输入 QTable @request答案

【问题标题】：Typing for QTable @request输入 QTable @request
【发布时间】：2022-08-09 16:49:22
【问题描述】：

我试图在 Typescript 中实现 \"Server side pagination, filter and sorting sample\"。

我使用QTableProps[\'onRequest\'] 进行道具输入，但它不起作用：

function onRequest (props: QTableProps[\'onRequest\']) {
   console.log(props);
}

这是 TS 报告的错误：

Type \'(props: ((requestProp: { pagination: { sortBy: string; descending: boolean; page: number; rowsPerPage: number; }; filter: (rows: readonly any[], terms: any, cols?: readonly any[] | undefined, getCellValue?: ((col: any, row: any) => any) | undefined) => readonly any[]; getCellValue: (col: any, row: any) => any; }) =>...\' is not assignable to type \'(requestProp: { pagination: { sortBy: string; descending: boolean; page: number; rowsPerPage: number; }; filter: (rows: readonly any[], terms: any, cols?: readonly any[] | undefined, getCellValue?: ((col: any, row: any) => any) | undefined) => readonly any[]; getCellValue: (col: any, row: any) => any; }) => void\'.
  Types of parameters \'props\' and \'requestProp\' are incompatible.

标签： quasar-framework quasar

【解决方案1】：

你能否提供更多关于你是如何做到这一点的细节。这是我如何实现相同目标的示例..

希望能帮助到你。

<q-table @request="onRequest"/>

import type  { QTableProps } from "quasar";

const onRequest: QTableProps['onRequest'] => ({pagination, filter, getCellValue}) =>{
//... your code here 
}

【讨论】：

谢谢，已经接近我需要的了。但我正在考虑将该方法与 Options API 一起使用。你能帮我解决这个问题吗？事实上，我需要在对象文字中输入方法。

【解决方案2】：

经过研究，我发现使用Parameters and NonNullable可以解决问题。

export default defineComponent({
  methods: {
    onRequest(
      props: Parameters<NonNullable<QTableProps['onRequest']>>[0]
    ) {
      // The rest of code
    },
  },
});

【讨论】：