共计 1096 个字符,预计需要花费 3 分钟才能阅读完成。
官网提供的文档只提供了一层
看到正好有敌人问 Dropdown 如何做级联
当初把代码贴到上面
三联四联做法统一
<el-dropdown trigger='click' :hide-on-click='false'>
<span class="el-dropdown-link">
<el-link type="primary" style='margin-left:10px;'>{{title}}</el-link>
<!-- <i class="el-icon-arrow-down el-icon--right"></i> -->
</span>
<el-dropdown-menu slot="dropdown">
<template v-for="item in menu">
<el-dropdown-item v-if='!item.childer'>{{item.title}}</el-dropdown-item>
<el-dropdown-item v-else>
<el-dropdown placement='right-start' >
<span class="el-dropdown-link">
{{item.title}}<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<template v-for='items in item.childer'>
<el-dropdown-item>{{items.title}}</el-dropdown-item>
</template>
</el-dropdown-menu>
</el-dropdown>
</el-dropdown-item>
</template>
</el-dropdown-menu>
</el-dropdown>
menu : [
{
title : "分类",
url : "",
childer :[
{
title : '分类 1',
url : '1111'
},
{
title : '分类 2',
url : '2222'
},
{
title : '分类 3',
url : '3333'
}
]
},
{
title : "我的",
url : "",
childer :[
{
title : '集体核心',
url : 'b1111'
},
{
title : '我的订单',
url : 'b2222'
},
{
title : '购物车',
url : 'b3333'
},
{
title : '零钱',
url : 'b4444'
},
{
title : '账户平安',
url : 'b5555'
}
]
},
{
title : '首页',
url : 'https://segmentfault.com/'
}
]
正文完