vuecropper插件的使用

94def755706e634e7d77b5c46bf2822.png

就是完成以上这种效果

vuecropper插件的使用说明：https://blog.csdn.net/kangkang_style/article/details/82776082

vuecropper就是一个组件来的，一般我们在父组件引进它

子组件corpperlabel 部分

console.log( (this.$refs.logo).files)
console.log( (this.$refs.logo).files[0])//返回以下

125700f541a9d76c1c889c669e85fc4.png

上传图片例子;

注意所有需要上传图片的接口，都需要先请求上传图片接口
图片接口上传完会返回一个图片地址给我们，再把图片地址放到添加数据的接口对应参数上即可

上传图片显示进度条demo

demo2vuecropper插件的使用+进度条