How close mobile menu after click on menu item

Question

I've build website menu with Alpinejs and Tailwindcss, but when i clicked on the menu item when has shown mobile menu and after this i do backward to previous page i can still see opened menu. How can i reach when the menu item is clicked "touched" and afterward i'am going back to the previous page menu isn't be open.

Here is a code:

<nav id="nav-main" @click.outside="menuIsOpen = false" x-cloak>
  <!--Hamburger-->
  <button
    @click.prevent="menuIsOpen = ! menuIsOpen"
    class="tham tham-e-slider tham-w-6 relative md:hidden"
    :class="{'tham-active': menuIsOpen}"
  >
    <span class="tham-box">
      <span class="tham-inner bg-gray-900" />
    </span>
  </button>
  <!--Menu list-->
  <ul
    class="md:flex md:px-6 text-gray-900 font-bold"
    :class="{ 'absolute p-6 top-20 left-7 right-7 text-center text-white bg-red-500 drop-shadow-md ': menuIsOpen, 'hidden': !menuIsOpen}"
    id="navbar-main"
    x-cloak
  >
    <li
      class="px-3 cursor-pointer hover:text-red transition-all"
      :class="{'py-3': menuIsOpen}"
    >
      <a href="/" class=" {{ 'md:text-red-500' if url === 'domov' }}"
        >Domov</a
      >
    </li>
    <li
      class="px-3 cursor-pointer hover:text-red transition-all"
      :class="{'py-3': menuIsOpen}"
    >
      <a href="/onas" class=" {{ 'md:text-red-500' if url === 'onas' }}"
        >O nás</a
      >
    </li>
    <li
      class="px-3 cursor-pointer hover:text-red transition-all"
      :class="{'py-3': menuIsOpen}"
    >
      <a href="/vyroba" class=" {{ 'md:text-red-500' if url === 'vyroba' }}"
        >Výroba</a
      >
    </li>
    <li
      class="px-3 cursor-pointer hover:text-red transition-all"
      :class="{'py-3': menuIsOpen}"
    >
      <a
        href="/kontakt"
        class=" {{ 'md:text-red-500' if url === 'kontakt' }}"
        >Kontakt</a
      >
    </li>
  </ul>
</nav>