vue Element el-upload 文件表格导入导出

vue Element el-upload 文件表格导入导出

使用的时候注意删注释

		  <el-upload
            action=""
            style="margin-left: 15px"
            :before-upload="beforeUploadTest"
            :headers="headers"
            multiple
            :limit="1"
            :on-exceed="handleExceed"
          >
            <el-button size="small" type="primary" icon="el-icon-download"
              >导入</el-button
            >
          </el-upload>
          <el-link
            target="_blank"
            :href="filterUrl"
            :underline="false"
            style="margin: 0 15px"
          >
          <!-- 导出直接用超链接下载 filterUrl获取后端的文件下载地址 后续替换自己的 -->
            <el-button class="btn" type="success" icon="el-icon-upload2">
              导出
            </el-button>
          </el-link>

  data() {
    return {
	    headers: {
	        authorization: "Bearer " + getToken(), // 获取token 后端验证用户身份需要 没有可以删
	        Accept: "application/json",
	    }
	 }
  }

    // 导入
    beforeUploadTest(file) {
      let formData = new FormData();
      formData.append("file", file);
      this.$http.post("stress_daoru", formData).then((res) => {
        if (res.code === 10000) {
          this.$message({
            message: "导入成功",
            type: "success",
          });
        } else {
          this.$message.error(res.message);
        }
      });
    },
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
      );
    },