Antd之表单清空操作(一)

最新推荐文章于 2024-09-03 18:01:56 发布

Quincy379

最新推荐文章于 2024-09-03 18:01:56 发布

阅读量2.8w

点赞数

分类专栏： ReactJS 文章标签： antd form

本文链接：https://blog.csdn.net/qq_33733970/article/details/80049371

版权

ReactJS 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
        if (!err) {
            console.log('Received values of form: ', values);
        }
    });
    //关键代码，不过这样会带来一个问题，校验时无法显示提示信息,解决方案看第二篇博客
    this.props.form.resetFields();
};

<Form onSubmit={this.handleSubmit} layout='inline'>
    <FormItem label={
        channelIndexTxt ||
        channelLayoutTxt ||
        channelTitleTxt ||
        channelDescriptionTxt ||
        channelEnabledTxt
    }>
        {getFieldDecorator('Channel_Datum', {
            rules: [{required: true, message: '必选项！'}],
        })(
            channelEnabledTxt ?
                <Switch
                    checkedChildren="开"
                    unCheckedChildren="关"
                    defaultChecked
                    onChange={this.handleChange}
                />
                :
                <Input
                    placeholder={'pls input ' + (
                        channelIndexTxt ||
                        channelLayoutTxt ||
                        channelTitleTxt ||
                        channelDescriptionTxt

                    )}

                />
        )}
    </FormItem>
    <Button type="primary" htmlType={'submit'}>修改</Button>
</Form>