Question

所以我得到了一个看起来像这样的表格：

<Form noValidate id="messageForm" onSubmit={(event) => {this.handleSendMessage(event)}}>
    <Form.Group as={Col} md="12" controlId="validationFormik01">
        <Form.Label bsPrefix="contact-title">{t('details.name')}</Form.Label>
        <Form.Control
            type="input"
            placeholder={t('details.namePlaceholder')}
            value={values.name}
            onChange={handleChange}
            name="name"
            isInvalid={!!errors.name}
        />
        <Form.Control.Feedback type="invalid">
            {errors.name}
        </Form.Control.Feedback>
    </Form.Group>
                        ...

这只是一个片段，但是我想例如重置第一个表单组，而不重置其他表单组。我该如何实现？在这些值在此函数中提交后，我正在尝试重置这些值：

handleSendMessage(event){
    event.preventDefault();
    const { t } = this.props;
    const self = this;
    UserService.sendMessage(event, this.props).then(function (status){
        toast.notify(t('details.messageSent'));
        // I WANT TO RESET THE VALUES HERE
    })
}

Answer 1

好吧，我最终像这样解决了它：

handleSendMessage(event){
    event.preventDefault();
    const { t } = this.props;
    UserService.sendMessage(event, this.props).then(function (status){
        toast.notify(t('details.messageSent'));
    })
    event.target[0].value = '';
    event.target[1].value = '';
    event.target[2].value = '';
}

提交后重置表单输入

1 个答案: