顯示隱藏組件 Vue.js 3

Question

我有一個導航欄和一個側邊欄（兩個獨立的組件），我試圖使用導航欄組件中的按鈕顯示/隱藏我的側邊欄，但它不起作用，我試過：

• v-show，v-if，使用 localStorage 值但什么都不做，側邊欄保持隱藏狀態。

邊欄：

<template>
<aside v-show="local_variable" class="fixed hidden h-full top-0 left-0 flex lg:flex flex-shrink-0 flex-col w-64">

</aside>
</template>

當與側邊欄一起使用時，是否需要更新導航欄中保存在 localStorage 中的值？

Answer 1

如果您想使用“v-show”、“v-if”切換組件的可見性，請刪除 tailwind 'hidden' class。 否則使用 Vue class 和樣式綁定https://vuejs.org/guide/essentials/class-and-style.html#binding-html-classes並刪除“v-show”、“v-if”。