List 使用Vuejs在循环生成的菜单中打开一个UL@点击

仍在处理我的菜单，正在努力解决一个新问题。 我希望用户能够在点击UL时打开LI子菜单。 问题是，我不知道如何只针对链接的LI元素。当我点击任何UL时，它会打开所有的LI

一个简单的方法是在HTML中创建不同的UL，但我想用循环菜单来保持这个简短的生成

我如何通过@click事件瞄准精确的UL，只打开它的子LI

newvue({
el:“应用程序”，
数据：{
类别：{
原子：[“按钮”、“图标”]，
分子：[]，
生物体：[]，
模板：[]，
实用程序：[“网格”]
},
openSubCategories:false，
},
})

.doc\u导航{
显示器：flex；
证明内容：围绕；
}
.doc_nav_ul{
利润率：0.30px；
}
李博士{
文本对齐：居中；
}
博士：第一个孩子{
边缘顶部：20px；
}

{{category}

{{子类别}}

使用CSS隐藏li。 我想你能应付

newvue({
el:“应用程序”，
数据：{
类别：{
原子：[“按钮”、“图标”]，
分子：[]，
生物体：[]，
模板：[]，
实用程序：[“网格”]
},
currentActiveCategory:空，
},
方法：{
变更（类别）{
如果（category==this.currentActiveCategory）this.currentActiveCategory=null
else this.currentActiveCategory=类别
}
}
})

.doc\u导航{
显示器：flex；
证明内容：围绕；
}
.doc_nav_ul{
利润率：0.30px；
}
.doc_nav_ul:不可见{
显示：无；
}
李博士{
文本对齐：居中；
}
博士：第一个孩子{
边缘顶部：20px；
}

{category}

{{子类别}}

这是高向阳的正确答案和有效答案

它正在使用css。 没有css的解决方案：v-if=“currentActiveCategory==category”

newvue({
el:“应用程序”，
数据：{
类别：{
原子：[“按钮”、“图标”]，
分子：[]，
生物体：[]，
模板：[]，
实用程序：[“网格”]
},
currentActiveCategory:空，
},
方法：{
显示子类别（类别）{
if（category==this.currentActiveCategory）{
this.currentActiveCategory=null
} 
else this.currentActiveCategory=类别
}
}
})

.doc\u导航{
显示器：flex；
证明内容：围绕；
}
.doc_nav_ul{
利润率：0.30px；
}
.doc\u nav\u li:不可见{
显示：无；
}
.doc\u nav\u li--可见{
显示：块！重要；
}
李博士{
文本对齐：居中；
}
博士：第一个孩子{
边缘顶部：20px；
}

{{category}

{{子类别}}

谢谢。我能够在你的代码之上构建我自己的代码，而且它可以工作。但是错误太多了。我不能接受你的答案，只是投赞成票；）哈哈。请原谅我没有调试代码，因为我通常喜欢给别人一个想法。