Question

所以我用钩子连接Typescript。当我尝试在父组件中呈现“注册用户”时，出现错误：

  interface IRegisterUser {
    mail: string;
    password: string;
  };

  let RegisterUser: React.FC<IRegisterUser> = (props) => {

    const InitialUserState = {mail: "", password: ""}
    const [user, setUser] = useState(InitialUserState)

    useEffect(() => {

    }, []);

    return (
        <div>
                <input type="text" className="text" name="username" value={user.mail}  placeholder="" required/>
                <input type="text" className="text" name="userpassword" value={user.password}  placeholder="" required/>
        </div>
    );
  }

Answer 1

给出您的评论：

用户应提供邮件+密码

RegisterUser应该不通过道具获得mail和password。

将props设为可选。

interface IRegisterUser {
  mail?: string;
  password?: string;
};

Answer 2

您的功能组件 RegisterUser 需要类型为 IRegisterUser 的道具。 IRegisterUser 接口定义了必需的 mail 和 password。

TypeScript 现在显示错误 (TS2739)，因为您在 <RegisterUser/> 中声明了 <ModalBody>，但未向其传递属性（mail 和 password）。

您可以通过声明以下内容来解决错误：

<ModalBody>
  <RegisterUser mail={''} password={''} />
</ModalBody>

另一种选择是将属性标记为可选（请参阅 Joseph D. 的解决方案），因为您已经在 InitialUserState 中初始化了这些属性。

您可以在此处查看此类错误的解决方案：https://youtu.be/Uo3PFfjgoXo?t=580

TS2739-以下属性缺少类型

2 个答案: