vue+element实现导入excel并拿到返回值

<template>

  <div class="main">

    <el-col :span="2">

      <el-upload

        class="upload-demo"

        :action="upUrl"

        accept=".xls, .xlsx"

        :data="shu"

        :on-success="upSuccess"

        :on-error="upError"

        :limit="1"

      >

        <el-button type="primary" icon="el-icon-upload">导入Excel</el-button>

      </el-upload>

    </el-col>

    <!-- 测试弹窗按钮 -->

    <el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button>

    <!-- 弹窗 -->

    <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">

      <span>{{Info}}</span>

      <span slot="footer" class="dialog-footer">

        <el-button @click="dialogVisible = false">取 消</el-button>

        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>

      </span>

    </el-dialog>

    <!-- 弹窗 结束 -->

  </div>

</template>

<script>

import { commonGet, appServer, commonPost2 } from "@/api/api";

export default {

  data() {

    return {

      upUrl: appServer() + "systemManagement/system/importTrExcel",

      excel: [],

      dialogVisible: false,

      Info: "",

      shu: {

        userName: this.$store.state.userName

      }

    };

  },

  methods: {

    upSuccess(res) {

      this.$message({

        type: res.type,

        message: res.msg

      });

      this.excel = res.data;

      window.console.log(this.excel);

      //   if (res.data.length > 0) {

      //     this.dialogVisible = true;

      //     switch (res.data) {

      //       case "res.data==1":

      //         this.Info = 拼接内容;

      //         break;

      //       case "res.data==2":

      //         this.Info = 拼接内容;

      //         break;

      //       case "res.data==3":

      //         this.Info = 拼接内容;

      //         break;

      //     }

      //   } else {

      //     this.$message({

      //       type: "indo",

      //       message: "自定义"

      //     });

      //   }

      // },

      // handleClose(done) {

      //   this.$confirm("确认关闭？")

      //     .then(_ => {

      //       done();

      //     })

      //     .catch(_ => {});

    },

    shu() {

      this.$store.state.userName;

    },

    upError() {

      this.$message({

        type: "error",

        message: "上传失败!"

      });

    }

  }

};

</script>

<style scoped>

</style>