Component doesn’t show after reload

by

I am working in react.js. I have button with onClick event. After click -> reload page and after reload want show some component bar on page.
Problem is that after reload that component doesn’t show.
How can I achieve this behavior ?

  const checkout = () => {
    setIsModalOpen(!isModalOpen)

    window.location.reload()

    toast.success("Thank you for your purchase!", {
      position: "top-center",
      autoClose: 4000,
      theme: "dark",
    })
  }

You can use sessionStorage which survives over page reloads and restores to persist a flag.

const checkout = () => {
  setIsModalOpen(!isModalOpen)
  sessionStorage.setItem('showToastAfterReload', 'true');
  window.location.reload();
}

useEffect(() => {
  if (sessionStorage.getItem('showToastAfterReload') === 'true') {
    toast.success("Thank you for your purchase!", {
      position: "top-center",
      autoClose: 4000,
      theme: "dark",
    });
    sessionStorage.removeItem('showToastAfterReload');
  }
}, []);

Leave a Comment