如何使用bootstrap和react.js设置提交警报?

时间:2019-02-24 05:07:40

标签: node.js reactjs twitter-bootstrap bootstrap-4 web-frontend

我是React.js的新手,我试图弄清楚如何在表单中设置一些功能。

我想做的是以下事情:

1)单击提交按钮后删除记录/输入(提交信息后,记录存储在数据库中,但记录/输入仍显示在表单中。

enter image description here

2)单击提交按钮后,我希望收到以下消息,以便让用户知道信息已成功提交

enter image description here

这是我的组件代码的一部分:

enter image description here

1 个答案:

答案 0 :(得分:0)

对于值重置:

  1. 将一个自定义函数绑定到onSubmit表单方法,该函数将重置表单值,提交数据并显示成功警报

  2. 使用setState重置字段值

  3. 使用您使用的API系统提交数据

  4. 添加新的布尔状态以告知页面是否显示您的警报。

  5. 在您的Submit方法中将布尔状态设置为true

  6. 在render方法中添加显示条件,如果布尔值设置为true,则显示警报,否则不显示