-- 创造无限可能

uview 1.x版本u-upload上传图片

2024-01-26 11:00:58
1380 人浏览 0 人点赞
有用,点赞支持一下
<u-upload 
    :file-list="picList" //默认显示的图片列表
    :action="url" 
    :before-upload="beforeUpload" //为图片上传之前的回调
    :before-remove="beforeRemove" //为图片删除之前的回调
></u-upload>

js方法:

    beforeUpload(index, list) {
      this.picList = []
      // console.log('list',list);
      list.map(async item => {
        this.picList.push({
          url: item.url
        })
        let result = await this.uploadFilePromise(item.url);
        console.log(result);
      })
      console.log('照片列表',this.picList);
    },

    // 上传图片
    uploadFilePromise(url) {
      return new Promise((resolve, reject) => {
        uni.uploadFile({
          url: apiUrl + "/admin/upload/imageOne", // 仅为示例,非真实的接口地址
          filePath: url,
          name: "file",
          formData: {
            typeEnum: "IMAGE",
          },
         header: {
             'X-CSRF-TOKEN': token.getToken('TOKEN') //自行定义token,根据接口要求是否需要加上
         },
          success: (res) => {
            resolve(res.data);
            console.log(res);
          },
        });
      });
    },