Typescript 给了我一个错误：Expected 0 arguments, but got 1

Posted 2023-04-14

【中文标题】Typescript 给了我一个错误：Expected 0 arguments, but got 1

【英文标题】：Typescript is giving me an error: Expected 0 arguments, but got 1

【发布时间】：2020-09-20 13:52:16

【问题描述】：

我想以正确的方式定义接口，但我遇到了麻烦，因为即使参数为空，它也需要一个参数。

我正在使用useContext，我定义了这样的接口：

    //react-auth0-spa.tsx
    interface Auth0Context 
        ......
        loginWithRedirect:  () => void; //I know this is the problem but I don't know what to define.
        ......
     

在提供者中，value 是：

 //react-auth0-spa.tsx
 <Auth0Context.Provider
     value=(
  ....
  loginWithRedirect: (...p: string[]) => auth0Client.loginWithRedirect(...p)
   ....
   )
>

现在，我 import 将上下文传递给其他文件，如下所示： const isAuthenticated, loginWithRedirect, logout = useAuth0()

这就是错误发生的地方

///components/NavBar.tsx
const  isAuthenticated, loginWithRedirect, logout  = useAuth0()
<div>
      !isAuthenticated && (
        <button onClick=() => loginWithRedirect()>Log in</button> //Expected 0 arguments, but got 1
      )
</div>

所以问题是 loginWithRedirect 需要 1 个参数，但 () => loginWithRedirect() 是一个空对象。这个问题可以通过在界面中使用any来解决，但是如果我想显式定义它应该放什么呢？

我尝试了loginWithRedirect: () => void，但现在loginWithRedirect: (...p: string[]) => auth0Client.loginWithRedirect(...p) 给了我这样的错误Type '' is not assignable to type 'string'.ts(2322)

没有打字稿的源代码是https://github.com/auth0-samples/auth0-react-samples/tree/master/01-Login/src

请帮忙。

【问题讨论】：

你的问题标题和描述有点矛盾。标题说它期待 0 个参数意味着它根本不期待任何参数。描述说它需要 1 个参数。

loginWithRedirect 可以调用的参数类型是什么？

如果不清楚，抱歉。我需要更改接口loginWithRedirect: () => void; 以便我可以使用<button onClick=() => loginWithRedirect()> 这意味着我需要在接口中提供一个我不知道该怎么做的参数

@Ali 我在界面中使用了loginWithRedirect: any; ，它正在工作。问题是，我需要明确定义它。我面临的问题是，如果接口为空，如何在接口中定义参数？ <button onClick=() => loginWithRedirect()

【参考方案1】：

问题首先是：

您在界面中提供了这样的函数签名：

loginWithRedirect: () => void;

这意味着没有参数，无论何时定义该函数，你都会服从这个签名，但相反，你在给它定义的同时将参数传递给函数。

解决方案

为什么不这样做呢？

//react-auth0-spa.tsx
    interface Auth0Context 
        ......
        loginWithRedirect:  (p: object) => void;
        ......
     

【讨论】：

是的，我提供了这样的loginWithRedirect: () => void;，但我需要做的是更改界面，使其接受onClick=() => loginWithRedirect()。这样，我将有 1 个参数来满足打字稿

@bradrar 但一个参数的类型必须与函数签名中的参数类型匹配。

是的，但我不知道怎么做。我已经阅读了有关函数的文档typescriptlang.org/docs/handbook/functions.html，但是这里的示例有参数，在我的例子中，函数是空的。

谢谢你的回答，我试过了，现在onClick=() => loginWithRedirect()错误是Argument of type '' is not assignable to parameter of type 'string[]'. Type '' is missing the following properties from type 'string[]': length, pop, push, concat, and 28 more.ts(2345)

@bradrar 我已经更新了答案，你可以试一试

【参考方案2】：

我的错误是没有提到参数类型，比如undernetah

interface Props 
  openSnackbarHandler: () => void

export const app:React.FC<Props> = ( openSnackbarHandler ) => 

   openSnackbarHandler("Password has been changed successfully!")



// method passed as props
const openSnackbarHandler: (mesg: string) => 
         console.log(mesg);

只需在参数中定义类型：

interface Props 
  openSnackbarHandler: (mesg: string) => void