Question

我尝试对Ant design input field validation做反应类型脚本，但我遇到此错误，无法正常工作

类型“ {}”中缺少属性“名称”，但类型中必需 “只读”

这是我的代码

import * as React from "react";
import {Button, Card, Col,  Form, Icon, Input, Row,} from "antd";
import moment from 'moment';
import "./style.css";



const {TextArea} = Input;
const {Option} = Select;

const InputGroup = Input.Group;





export namespace Bookform {
    export interface Props {
       name:string;

    }
}

export class Bookform extends React.Component<Bookform.Props, any,any> {



    formRef: any = React.createRef();

    componentDidMount() {
        this.formRef.current.setFieldsValue({
            username: 'Bamboo',
        });
    }
    render() {

        return (

            <div className="my-book">
                <Form onSubmit={this.onSaveBook} name="base"  ref={this.formRef}>

                    <Row gutter={[8, 8]}>
                        <Card size="small" >
                            <Col span={12}>

                                <Form.Item 
                                    name="username" rules={[{ required: true }]}>
                                  <Input placeholder="My book"/>

                            </Form.Item>
                            </Col>

                        </Card>
                    </Row>
         <div>
                        <Button type="primary" htmlType="submit" block><Icon type="save"/>Add book</Button>


                    </div>

                </Form>
            </div>


        );
    }
}

Answer 1

问题在于道具的定义。确保name道具始终具有价值，或使其成为可选，如下所示。

export interface Props {
    name?: string;
}

蚂蚁设计类型脚本输入字段验证不起作用

1 个答案: