ReactJS

Question

我正在使用 reactstrap 组件。有不止一个输入。如何将某些字段设置为 "required"。也就是说，用户不能通过空闲。怎样才能做出这样的限制？

<Row>
   <Col xs="2">customer name</Col>
   <Col xs="6">
        <Input
        required
        maxLength={"20"}
        type={"text"}
        placeholder={"customer name"}
        name={"customerName"}
        defaultValue={this.state.customerName}
        onChange={this.handleChange}
        />
   </Col>
</Row>

Answer 1

你试过这个吗：https://availity.github.io/availity-reactstrap-validation/？做得很好。

很抱歉写在这里，但似乎没有足够的声誉来回答。

availity-reactstrap-validation 使用一些不错的功能（例如验证）扩展了 reactstrap 表单。

为了让标签在左边，输入在右边，你可以像这样混合它们：

<AvForm onValidSubmit={handleValidSubmit} onInvalidSubmit={handleInvalidSubmit}>
        <FormGroup row>
            <Label for="name" sm={2}>Name</Label>
            <Col sm={10}>
                <AvField name="name"  type="text" required />
            </Col>
        </FormGroup>

    </AvForm>

确保您已导入所有库。

ReactJS - 我如何验证输入字段

ReactJS - How do I validate input fields

requiredfieldvalidator

required-field

required