vue2.0使用v-for循环制作多级嵌套菜单栏

<div class="level-one" v-if="obj.level == 1" v-for="obj in bar1"><a>{{obj.title}}</a>  <div class="level-two" v-if="obj1.parentId == obj.id " v-for="obj1 in bar1"><a>{{obj1.title}}</a>   <div class="level-three" v-if="obj2.parentId == obj1.id" v-for="obj2 in bar1"><a>{{obj2.title}}</a></div>  </div> </div> level-one{  text-indent: 1em; } level-two{  text-indent: 2em; } level-three{  text-indent: 3em; } bar1:[  /*所有第一级菜单*/  {   title:'一级菜单（1）',   id:1,       //选项的唯一ID   parentId:0,    //父级的ID   level:1      //所处的层级  },  {   title:'一级菜单（2）',   id:2,   parentId:0,   level:1  },  {   title:'一级菜单（3）',   id:3,   parentId:0,   level:1,  },  /*所有二级菜单*/  {   title:'二级菜单（1.1）',   id:4,   parentId:1,   level:2  },  {   title:'二级菜单（1.2）',   id:5,   parentId:1,   level:2  },  {   title:'二级菜单（2.1）',   id:6,   parentId:2,   level:2  },  {   title:'二级菜单（2.2）',   id:7,   parentId:2,   level:2  },  /*所有三级菜单*/  {   title:'三级菜单（1.1.1）',   id:8,   parentId:4,   level:3  },  {   title:'三级菜单（1.1.2）',   id:9,   parentId:4,   level:3  } ]