el-upload传多余的参数

1,html

          :data="extraData"

          class="avatar-uploader"

          :action="$actionUrl + '/upload/single/img'"

          :show-file-list="false"

          :on-success="handleAvatarSuccess"

          :before-upload="beforeAvatarUpload"

          @change="handUpImg($event)"

        >

         

         

           

         

         

            {{ imageUrl ? "重新上传" : "请上传png格式图片" }}

         

       

 el-upload传多余的参数_第1张图片

 2,js

    handleAvatarSuccess(res, file) {

      this.imageUrl1 = res.data;

      this.imageUrl = URL.createObjectURL(file.raw);

      //   const _ = this;

      //   let files = file.raw;

      //   const formData = new FormData();

      //   formData.append("file", files);

      //   formData.append("prefix", "user");

      //   _.$api.files_api

      //     .singleImg(formData, {

      //       headers: {

      //         "Content-Type": "multipart/form-data",

      //         Authorization: localStorage.getItem("token"),

      //       },

      //     })

      //     .then((res) => {

      //       if (res.code == 200) {

      //         this.imageUrl1 = res.data;

      //       }

      //     })

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

    },

    beforeAvatarUpload(file) {

      const isJPG = file.type === "image/jpeg";

      const isPNG = file.type === "image/png";

      if (!isJPG && !isPNG) {

        return this.$message.error("上传头像图片只能是 JPG 或 PNG 格式!");

      }

3,data

 

 data() {

    return {

      extraData: {

        prefix: "user",

      },

    };

  },

你可能感兴趣的:(前端,vue.js,javascript,学习,html)