首页 > Web开发 > 详细

view js 实现 树形菜单

时间:2017-06-29 16:37:01      阅读:195      评论:0      收藏:0      [点我收藏+]
添加一个模板。
<
template id="menu-template"> <li v-if="model.nodes!=undefined"> <a href="#" class="menu-dropdown"> <i class="menu-icon ${child.icon!‘‘}"></i> <span class="menu-text"> {{model.title}} </span> <i class="menu-expand"></i> </a> <ul class="submenu"> <item v-for="model in model.nodes" :model="model"></item> </ul> </li> <li v-else> <a href="javascript:void(0)" data-url=""><i class="menu-icon "></i> <!-- 图标 --> <span class="menu-text">{{model.title}}</span></a> </li> </template>
注册组件
Vue.component(‘item‘, { template: ‘#menu-template‘, props: { model: Object } })

使用:

<item  v-for="model in message" :model="model"></item>   message 为一个 数组

view js 实现 树形菜单

原文:http://www.cnblogs.com/whm-blog/p/7094588.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!