vue 项目 上传以及下载excel 图表（思路）

简单的 页面效果图：

要求可以 上传以及可以 下载excel 图表（本文章为思路）

   

目录

导入导出思路：

1.在 components 下创建文件夹并创建文件home.vue;

 2.在 views 下创建文件 download-excel.vue下载文件 和 upload-excel.vue 上传文件，在路由文件里配置路由,使用懒加载进行引入即可！！

3.在首页里，给一个父级div,单个子集div,分别class 命名： 父级 “container”,子集依次是"c_header","c_left","c_right";

4给页面布局： 

5.给头部div 输入文字        智能物流管理系统

6.在layout 文件夹下创建Menuleft.vue 文件；

7.在src 里创建until 文件夹， 且在里边创建request.vue (进行axios)

8.在src 里创建api 文件夹， 且在里边创建excel.js      在其里边引入request.vue 文件

9.在导出文件  download-excel.vue 文件里  

10.  在src 里   创建文件夹 mock  且 创建index.js      

11.    在mock 文件里  创建 excel.js 文件              

12.     在 mock里的index.js 里    <1  引入   excel  

13导出功能

      <1 在download-excel.vue 文件里的方法；

 <2在download-excel.vue  里     引入vendor

---

导入导出思路：

1.在 components 下创建文件夹并创建文件home.vue;

在路由文件里配置文件,且将此页面作为重定向即可！！

 2.在 views 下创建文件 download-excel.vue下载文件 和 upload-excel.vue 上传文件，在路由文件里配置路由,使用懒加载进行引入即可！！

---

3.在首页里，给一个父级div,单个子集div,分别class 命名： 父级 “container”,子集依次是"c_header","c_left","c_right";

---

4给页面布局： 

  .container{
           c_header{
                   width:100%;
                    height:60px;
                    position:absolute;
                    left:0;
                    top:0
                   background:#f00; //红色，方便前期观看，后期还需注掉
                    z-index：999
          }
              c_left{
                     width:200px;
                      position:absolue;
                       left:0;
                       top:0;
                       bottom:0;
                       margin-top:60px;
                       background:#f90;//橘黄色
           }
                c_right{
                       position:absolute;
                        top:0;
                        right:0;
                       left:200px;
                       bottom:0;
                       background:#0f9;//绿色

           }

}

---