我正在Vue 3中建立一個過濾器頭部，在其中你可以選擇一個類別進行查看，因此你可以點擊切換過濾器的開關，如果你點擊另一個類別，它將取消選擇之前的活動類別，一次只能有一個或沒有活動類別。

我找到了一些範例，像是這個jsfiddle，它沒有可切換的按鈕（再次點擊取消選擇）並且沒有使用v-for循環。我相當有信心可以將其轉換為v-for循環，但我不知道如何輕鬆地進行切換和一次只能有一個活動類別的操作。

這是我的基本程式碼：

 {{ category }}  

const contentCategories = ["category 1", "category 2", "category 3"]; let list = contentStore.resources; const activeCategory = ""; const filteredList = list .filter((e) => e.category === activeCategory) .map((e) => { return e; }); 

我認為我需要的行為是將活動類別儲存在activeCategory字串中，並將活動標籤應用於相應的按鈕，然後能夠如果再次點擊活動按鈕，則移除該activeCategory，或者如果點擊了不同的按鈕，則更改activeCategory。

如果這是一個簡單的解決方案，我很抱歉，因為我對Vue非常陌生。謝謝！