首页 > 解决方案 > 已成功提交有关 React 的警报

问题描述

如何在 React 上获得成功提交的警报

嗨,我是 React 新手,我创建了一个联系我们页面,所以当用户单击提交按钮时我想显示一条消息,提交成功我不知道该怎么做?谁能帮我解决这个问题,拜托

#这是我的代码主体

  import React, { Component } from "react";
  import axios from "axios";
 
   class ContactUS extends Component {
      constructor(props) {
        super(props);
    
        this.state = {
          name: "",
          email: "",
          contact: "",
          message: "",
         

        };
      }
    
      handleData = (e) => {
        this.setState({
          [e.target.name]: e.target.value,
        });
      };
    
      handleSubmit = (e) => {
        e.preventDefault();
        console.log(this.state);
    
        // conditions
    
       
          ) {
            axios
              .post(API_BASE_URL + "contactus/", {
                name: this.state.name,
                email: this.state.email,
                contact: this.state.contact,
                message: this.state.message,
              })
              .then((response) => {
                this.setState({
                 resData: response.data,             
                });
              
                this.setState({
                  name: "",
                  email: "",
                  contact: "",
                  message: "",
                });
              }
              })
              .catch(function (error) {
                console.log(error.response);
              
                
              });
          } else {
            this.setState({
              resData: "Oops! Something went wrong!",
            });
          }
        }, );
      };
    
 

标签: reactjs

解决方案


添加

 this.state = {
          name: "",
          email: "",
          contact: "",
          message: "",
         success : false
        };

如果成功

this.setState({ success: true});

在渲染中

{this.state.success ? 
"success" : "awaiting"
}

推荐阅读