首页 > 代码库 > view js 实现 树形菜单

view js 实现 树形菜单

添加一个模板。
<
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 实现 树形菜单