Tailwind Alpine js drop down is opening on page reload

Show your relevant code.

\div x-data="{ dropdownOpen: false }" class=" relative "> <button @click="dropdownOpen = ! dropdownOpen" class="relative block h-8 w-8 rounded-full overflow-hidden shadow focus:outline-none ">

< ul x-show="dropdownOpen" @click.away="dropdownOpen=false" class=" relative fixed inset-0 h-full w-full z-10">

                <li  class="  absolute right-0 mt-2 w-48 bg-white rounded-md overflow-hidden shadow-xl z-10">
                    <a href="#" class=" block px-4 py-2 text-sm text-gray-700 hover:bg-indigo-600 hover:text-white">Profile</a>
                    <a href="#" class=" block px-4 py-2 text-sm text-gray-700 hover:bg-indigo-600 hover:text-white">Products</a>
                    <a href="/login" class=" block px-4 py-2 text-sm text-gray-700 hover:bg-indigo-600 hover:text-white">Logout</a>
                </li>
        </ul>
    </div>

you mean it briefly appears? use x-cloak

yes i used x-cloak in div tag and used [x-cloak] { display: none } in css.

It is working fine now....

thanks to all