向 SWR 发出请求时打字稿出现问题

Question

我想知道传递给我的函数的参数类型是什么

const fetcher = async (...args) => {                                
~_  0   const res = await fetch(...args);                                                                       
    1                                            
~   2   return res.json();                                                                                      
    3 };

这是我的 SWR 获取函数，这是我遇到的错误

[tsserver 2556] [E] Expected 1-2 arguments, but got 0 or more.

SWR挂钩

const { error, data } = useSWR(`/api/albums/list/${user.id}`, fetcher)

Answer 1

这是 fetch 函数的 TypeScript 签名：

declare function fetch(input: RequestInfo, init?: RequestInit): Promise<Response>;

如果你使用函数 rest parameters ...args，你的 fetcher 函数可以像这样用零参数调用并且 tsc 不会报告错误。

fetcher();

或者，很多参数（比如四个参数）：

fetcher("localhost", {}, {}, {});

然后，你使用spread syntax to call the fetch API。 spread的参数不满足fetch的函数签名（参数不能为0或大于2），所以tsc报错。

所以你最好这样修改:

const fetcher = async (
  input: RequestInfo,
  init: RequestInit,
  ...args: any[]
) => {
  const res = await fetch(input, init);
  return res.json();
};

包版本："typescript": "^4.1.3"

向 SWR 发出请求时打字稿出现问题

Problem with typescript while making request to SWR

javascript

typescript

reactjs

next.js

swr