Vue.js菜单三级以至于多级联动

公司项目使用Vue.js 前端初学Vue.js 然后给我的静态页面刚开始都能点的动

但是接入接口进行数据绑定之后 就点不动了 一番了解之后 才知道是他绑定的是Jquery的click事件

在Vue中会因为渲染问题导致失效 常见的解决方法通过setTimeout来 但这很不Vue

于是

   首先定义三个变量

openOLM:0,
openTLM:0,
openSLM:0,

分别是一级二级三级菜单的索引

然后分别

  :style="{display:(m1_Index==openOLM)?'':'none'}"

:style="{display:(m2_Index==openTLM)?'':'none'}"

:style="{display:(m3_Index==openSLM)?'':'none'}"

这是加在菜单对应的Html标签上控制菜单的显示 

然后分别加上点击事件

@click="openOLM=(m1_Index==openOLM?null:m1_Index),openTLM=null,openSLM=null"

@click="openTLM=(m2_Index==openTLM?null:m2_Index)

@click="openSLM=(openSLM==m3_Index?null:m3_Index)

这样就通过索引控制 菜单的显示以及打开 然后通过点击菜单 修改索引  修改菜单的展开与否

写不下去了

有什么问题直接联系q 451922429吧