关闭表单提交的弹出窗口，并在reactjs中的父组件上显示成功/错误消息

在ReactJS中关闭表单提交的弹出窗口并在父组件上显示成功/错误消息，可以通过以下步骤实现：

创建一个弹出窗口组件，用于显示成功/错误消息。该组件可以包含一个状态变量，用于控制弹出窗口的显示与隐藏，并接受一个消息参数用于显示成功/错误消息内容。
在父组件中，创建一个状态变量来控制弹出窗口的显示与隐藏，并创建一个状态变量来存储成功/错误消息内容。
在表单提交的处理函数中，根据提交结果设置成功/错误消息内容，并将弹出窗口的显示状态设置为true。
在弹出窗口组件中，根据状态变量控制弹出窗口的显示与隐藏，并显示成功/错误消息内容。

下面是一个示例代码：

// 弹出窗口组件
import React from 'react';

const Popup = ({ message, onClose }) => {
  return (
    <div className="popup">
      <div className="popup-content">
        <p>{message}</p>
        <button onClick={onClose}>关闭</button>
      </div>
    </div>
  );
};

export default Popup;

// 父组件
import React, { useState } from 'react';
import Popup from './Popup';

const ParentComponent = () => {
  const [showPopup, setShowPopup] = useState(false);
  const [message, setMessage] = useState('');

  const handleSubmit = (event) => {
    event.preventDefault();
    
    // 表单提交处理逻辑
    // ...

    // 假设提交结果为成功
    const successMessage = '提交成功！';
    setMessage(successMessage);
    setShowPopup(true);
  };

  const handleClosePopup = () => {
    setShowPopup(false);
  };

  return (
    <div>
      <form onSubmit={handleSubmit}>
        {/* 表单内容 */}
        {/* ... */}
        <button type="submit">提交</button>
      </form>

      {showPopup && <Popup message={message} onClose={handleClosePopup} />}
    </div>
  );
};

export default ParentComponent;

在上述示例中，弹出窗口组件Popup接受message和onClose作为参数，分别用于显示成功/错误消息和关闭弹出窗口。父组件ParentComponent中使用useState来创建状态变量showPopup和message，分别用于控制弹出窗口的显示与隐藏以及存储成功/错误消息内容。在表单提交处理函数handleSubmit中，根据提交结果设置成功/错误消息内容，并将弹出窗口的显示状态设置为true。最后，在父组件中根据showPopup的值决定是否显示弹出窗口，并将成功/错误消息传递给弹出窗口组件。

这是一个简单的示例，你可以根据实际需求进行修改和扩展。