im working on an project which trying to implement a list of menu with the condition on v-if statement on v-for by passing id to onclick function however its encounter an error . Kindly advise
HTML VUE：
<div id="app">
<aside id="side-center">
<ul id="asideList" class="asideList">
<li id="nav01" v-for="items , index in ListMenu.ListMain">
<div class="navmenu" @click="select()">{{ items.menu_group_name}}</div>
<div id="side-left">
<ul v-if="items.id === ?">
<li v-for="items in ListSub1">{{items.text}}</li>
</ul>
</div>
</li>
</ul>
</aside>
</div>
IMAGE OF DATA :
ListMenu: {
ListMain: [
{
id:1,
menu_group_name: 'A',
ListSub1: [
{text: '10'},
{text: '100'},
{text: '1000'}
]
},
{
id:2,
menu_group_name: 'B'},
{
id:3,
menu_group_name: 'C'},
{
id:4,
menu_group_name: 'D'}
],
}
As you can see above of the data , i was trying to onclick on the menu_group_name while trying to pass over the id on select while on the ul side you will see there is v-if statement which trying to check the id if match then display the list of ListSub1.
My script
selectMenu: function() {
$("#side-left").toggle();
}
How do we do this ?
