Vuejs2 Vue停止列表/扩展

如果单击展开的元素，我想阻止列表崩溃。因此，如果我单击任何折叠的标题，它应该展开，但如果我单击同一标题，它不应该折叠，而是保持活动/展开状态（单击其他折叠的标题将起作用，上一个标题将折叠）。我试过摆弄

v-model

，

：value

，和

stopPropagation（）

，但运气不好。这里是一个示例，其中

活动

道具是正确的，但当

活动

时元素仍会崩溃

newvue({
el:“#应用程序”，
数据（）{
返回{
disableNavbar：是的，
项目：[
{
行动：‘本地_活动’，
标题:"景点",，
项目：[
{title:'列表项'}
]
},
{
行动:"餐厅",，
标题:"餐饮",，
主动：对，
项目：[
{标题：'早餐和早午餐'}，
{标题：'新美国人'}，
{标题：'寿司'}
]
},
{
行动:"学校",，
标题:"教育",，
项目：[
{title:'列表项'}
]
},
{
行动：'运行方向'，
标题：“家庭”，
项目：[
{title:'列表项'}
]
},
{
行动:"康复",，
标题:"健康",，
项目：[
{title:'列表项'}
]
},
{
动作：'内容切'，
标题：“办公室”，
项目：[
{title:'列表项'}
]
},
{
行动：“本地报价”，
标题:"推广",，
项目：[
{title:'列表项'}
]
}
]
}
},
方法：{
测试（即，e）{
log（'clicked'+i+'+JSON.stringify（e））；
if（this.items[i].hasOwnProperty（'active'））{
console.log（this.items[i].active.toString（））；
}
this.items.forEach（（obj，ind）=>{
如果（ind！==i）{
obj.active=false；
}
})
log（JSON.stringify（this.items））；
if（this.items[i].hasOwnProperty（'active'）&this.items[i].active）{
event.stopPropagation（）；
e、 停止传播（）；
}
this.items[i].active=true；
}
}
})

{{item.title}
{{subItem.title}}
{{subItem.action}
简单解决方案：
@click.native.stop=“yourAction”
简单解决方案：
@click.native.stop=“yourAction”