vue的图片剪切插件VueCopper及上传

GitHub:vue-cropper

利用vue-cropper做的关于图片裁剪、压缩、上传、预览等做的一个公共组件

自己做的弹窗裁剪







注意

上传文件流需要使用FormData对象,将需要参数通过append方式加入,最终axios请求只需要data:formData即可

例如:

 reqUpdateStudyPlanCtPhoto() {
      let formData = new FormData();
      //将参数一一添加
      formData.append(
        'learning_plan_employee_avatar_file',
        this.finishCropperData
      );
      formData.append('learning_plan_employee_name', this.ctName);
      formData.append('employee', this.email);

      return formData;
    },
    
    //data:formData
    function postUpdateStudyPlanCtPhotoApi(formData) {
  return Axios({
    url: ' /api/permission/employee/update/',
    method: 'post',
    data: formData,
  });
}

???

不知道为啥,默认裁剪框宽高无效。难受。

你可能感兴趣的:(vue的图片剪切插件VueCopper及上传)