javascript - 如何改变状态？

Question

我有一个表单，当我单击按钮时，我必须显示消息。消息有两种状态 - setMessageShown (true); 和 setMessageShown (true);

如何将 handleSubmit 内的状态更改为 true - setMessageShown(true);？

const handleSubmit = e => {
  e.preventDefault();
  // ...
};

const ReviewPopup = ({ name }) => {
  const [messageShown, setMessageShown] = useState(false);
  const hideMessage = () => {
    setMessageShown(false);
  };

  return (
    <form onSubmit={handleSubmit} className="new_review" id="new_review" action="/reviews" acceptCharset="UTF-8" method="post">
    // ...
    </form>
  );
};

Answer 1

将 handleSubmit 放入组件内。

const ReviewPopup = ({ name }) => {
  const [messageShown, setMessageShown] = useState(false);
  const hideMessage = () => {
    setMessageShown(false);
  };

  function handleSubmit(e) {
    e.preventDefault();
    setMessageShown(true);
  }

  return (
    <form onSubmit={handleSubmit} className="new_review" id="new_review" action="/reviews" acceptCharset="UTF-8" method="post">
    // ...
    </form>
  );
};