@lambo-design-mobile/app-center

加载更多

介绍

AppCenter 是一个应用菜单展示组件

引入

import Vue from 'vue';
import AppCenter from '@lambo-design-mobile/app-center';

Vue.use(AppCenter);

代码演示

基础用法

<app-center  :datas="datas" @on-my-app-change="onChange" />

export default {
  data() {
    return {
      datas:{
        menus:[{
                "name": "网上配货1",
                "meta": {
                  "permissionId": "5313240410000000002",
                  "title": "网上配货1"
                },
                "children": [{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000001",
                      "title": "菜单1",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000002",
                      "title": "菜单2",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000003",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000004",
                      "title": "菜单1",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000005",
                      "title": "菜单2",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000006",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000007",
                      "title": "菜单1",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000008",
                      "title": "菜单2",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "5313240410000000009",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },
                  {
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000010",
                      "title": "菜单4",
                      "icon": "/docs/logo.png"
                    }
                  }
                ]
              }, {
                "type": 1,
                "name": "网上配货2",
                "meta": {
                  "permissionId": "5313240410000000002",
                  "title": "网上配货2"
                },
                "children": [{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000011",
                      "title": "菜单1",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000012",
                      "title": "菜单2",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000013",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000014",
                      "title": "菜单1",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000015",
                      "title": "菜单2",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000016",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000017",
                      "title": "菜单1",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000018",
                      "title": "菜单2",
                      "icon": "/docs/logo.png"
                    }
                  },{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "53132404100000000019",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },
                  {
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "531324041000000000110",
                      "title": "菜单4",
                      "icon": "/docs/logo.png"
                    }
                  } ,{
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "531324041000000000120",
                      "title": "菜单3",
                      "icon": "/docs/logo.png"
                    }
                  },
                  {
                    "uri": "/ism/am/monthplan/plansubmit/index",
                    "meta": {
                      "appId": "5313240226000000001",
                      "permissionId": "531324041000000000121",
                      "title": "菜单4",
                      "icon": "/docs/logo.png"
                    }
                  } ]
              }],
        myApp:[{
                "uri": "/ism/am/monthplan/plansubmit/index",
                "meta": {
                  "permissionId": "5313240318000000015",
                  "title": "菜单",
                  "icon": "/docs/logo.png",
                },
              },{
                "uri": "/ism/am/monthplan/plansubmit/index",
                "meta": {
                  "permissionId": "5313240318000000015",
                  "title": "菜单",
                  "icon": "/docs/logo.png",
                },
              }]
      },
    }
  },
   mounted() {
    this.datas.myApp = JSON.parse(localStorage.getItem("myApp"))||[]
  },
  methods: {
    onChange(data) {
      localStorage.setItem("myApp",JSON.stringify(data))
 
    },
  }, 
}

Props

参数	说明	类型	默认值	版本
datas	数据	array	-	-

Events

事件名	说明	回调参数
on-my-app-change	我的应用数据发生改变	param