sub-menu

安装

安装：yarn add zd-sub-menu | npm install zd-sub-menu

引入

在 main.js 中引入：import zdSubMenu from "zd-sub-menu"

使用

main.js 入口文件中引入并使用组件

    import Vue from "vue";
    import App from "./App.vue";
    import store from "./store";
    import ElementUI from "element-ui";
    import zdSubMenu from "zd-sub-menu";
    Vue.use(zdSubMenu);
    new Vue({
        router,
        store,
        render: (h) => h(App),
    }).$mount("#app");

要显示的位置要加的组件标签及属性:

    /*
        sideMenu:侧边菜单要展示的数据
        类型：Array
        [
            {
                component:...,
                path:...,
                name: ...,
                meta:{
                    fullPath:...,
                    icon:...,
                    name:...
                },
                children:[
                    {
                        component:...,
                        path:...,
                        name:...,
                        meta:{
                            fullPath:...,
                            icon:...,
                            name:...
                        },
                    },
                    {
                        ...
                    }
                ]
            }
        ]
    */
    <subMenu :sideMenu="sideMenu"></subMenu> | <sub-menu :sideMenu="sideMenu"></sub-menu>

router 路由中要加的属性，例如：

    /*
        路由中带上meta属性：
        fullPath:可以用作跳转的路由
        icon:菜单选项前面的图标
        name:菜单选项显示的文字
    */
    {
        path: "welcome",
        component: () => import(/*webpackChunkName: "welcome"*/"../pages/Home/Welcome"),
        name: "welcome",
        meta: {
            fullPath: "/welcome",
            icon: "",
            name: "管理首页"
        }
    },