后台管理小结2

左侧导航栏

接口中拿的活数据

    //菜单栏信息
    async getmenu() {
      let { data: res } = await muney.getList();
      console.log(res);
      this.menulist = res;
    },

动态切换页面

    <el-submenu
              :index="item.path"
              v-for="(item, index) in menulist"
              :key="index"
            >
         </el-submenu>

页面

基本就是增删改查 还有分页搜索
echarts配置使用

这是最后一个图表页面，具体可以参考echarts官网使用https://echarts.apache.org/examples/zh/index.html

难点

个人感觉商品管理里面的 “商品列表 分类参数” 和 权限管理里面的 “权限管理里面的权限分配”

项目过程中的记录

1 子组件和一些可复用组件
2 slot插槽
3 :routes="[child]" :key=“child.path”
4matched=[{path:’/dashboard’,meta:{title:Dashboard}}].concat(matched)
5filter
6 有header+main+sidebar，怎么在 main中点击 Header组件里的menu,去触发 SideBar的效果呢。这需要用到组件中的通信，并且不是父子组件，
参考方法 1可以使用this.$root.$emit和this.$root.$on试试,event bus 2vuex,因为项目里使用了vuex,所以应该是从vuex找方法了
7路由懒加载和权限验证和进度条
8require.context
9promise
10easy-mock.js
11支持无限嵌套路由，所有侧边栏这块使用了递归组件
12api模块和views组件命名一一对应