如何修复“以下属性中缺少类型 '{}'...";打字稿错误? [英] How to fix "Type '{}' is missing in the following properties..." error in Typescript?
问题描述
我是 Typescript 的新手,因此遇到了问题.我正在使用 Ant Design 并遵循如何在 Typescript 中使用 Form 但使用 FunctionComponent
;但是,我收到了 Typescript 抛出的错误:
I'm new to Typescript and therefore having a problem about it.
I'm using Ant Design and followed how to use Form in Typescript but with FunctionComponent
; however, I'm getting an error thrown by Typescript:
TypeScript 错误:类型{}"缺少类型Readonly<RcBaseFormProps &"中的以下属性Pick
代码如下:
import React, { useState } from 'react';
import { Form, Input, Row, Col } from 'antd';
import { FormComponentProps } from 'antd/lib/form';
interface SetupFormProps extends FormComponentProps {
username: string;
email: string;
password: string;
confirm_password: string;
first_name: string;
last_name: string;
}
const SetupForm: React.FC<SetupFormProps> = ({ form }) => {
...
return (
<Form id="setup-form" layout="vertical" onSubmit={handleSubmit}>...</Form>
)
}
export default Form.create<SetupFormProps>({ name: 'register' })(SetupForm);
在我的另一个组件中,我是这样访问它的:
and in my other component, I'm accessing it this way:
import SetupForm from './form';
<SetupForm />
推荐答案
props 接口中的所有 props 都是必需的(它们不能被 undefined)
All the props in your props interface are required (they can't be undefined)
interface SetupFormProps extends FormComponentProps {
username: string;
email: string;
password: string;
confirm_password: string;
first_name: string;
last_name: string;
}
但是你在使用你的组件时没有从界面中指定 props
But you are using your component without specifying the props from the interface
<SetupForm />
所以你应该从界面(SetupFormProps)中指定道具
So you should either specify the props from the interface (SetupFormProps)
<SetupForm username="myUserName" ...etc />
或者让道具可选
interface SetupFormProps extends FormComponentProps {
username?: string;
email?: string;
password?: string;
confirm_password?: string;
first_name?: string;
last_name?: string;
}
这篇关于如何修复“以下属性中缺少类型 '{}'...";打字稿错误?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!