title: Vue实现左右菜单联动实现
date: 2018-08-11 16:31:34
tags:
Vue
左右联动
top: 100
copyright: true
根据掘金评论需求,更新了数据接口并修复了一些问题
之前在外卖软件上看到这个左右联动的效果,觉得很有意思,所以就尝试使用Vue来实现,将这个联动抽离成为一个单独的组件,废话少说,先来一张效果图。
这个组件分为两个部分,1、左菜单;2、右菜单。
动态数据结构
menus: [
{
name: '菜单1',
data: [
{
name: '1.1'
},
{
name: '1.2'
},
{
name: '1.3'
},
{
name: '1.4'
},
{
name: '1.5'
},
{
name: '1.6'
}
]
}
]
复制代码
data数据是用户自定义增加一些内容ÿ