Question

我有一个 ContactForm 组件，它接收消息、电子邮件和姓名输入并使用 sendgrid 发送电子邮件。

成功后，成功消息会正确显示，但错误未显示在组件中。

这是我的代码：

const MyChildComponent = () =>{
   const[eziSearchCriteria, setEziSearchCriteria] = useState<IEziStatusSearchCriteriaForm>();

  useEffect(() =>{
    setSearchCriteria();
  },[]);

   const setSearchCriteria =() =>{
  
    const s1: IEziStatusSearchCriteriaForm = location.state.searchCriteria;  // in debugger, I can see data in s1
     setEziSearchCriteria(s1);
     console.log("data ",eziSearchCriteria);  // this console undefined???? need help here        
    }

收到错误消息未显示

关于成功： Succes Message Image success message

控制台中显示的错误代码： Error Response Code

Error response message

Answer 1

在 JavaScript 中，您在 catch 块中处理获取错误，如下所示：

emailContactForm({ authorEmail, name, email, message }).then((data) => {
        setValues({
          ...values,
          sent: true,
          name: "",
          email: "",
          message: "",
          buttonText: "Sent",
          success: data.success,
        });
      }
    }).catch(error => {
          setValues({ ...values, error });
    });

还尝试像这样更改 display 的 css：

const showErrorMessage = () => (
    <div
      className="alert alert-danger"
      style={{ display: error ? "block" : "none" }}
    >
      {error}
    </div>
  );

联系表单错误消息在组件中不可见

1 个答案: