template
<a class="btn" @click="toggleShow">设置头像</a>
<my-upload field="img" @crop-success="cropSuccess" v-model="show" :width="100" :height="100" img-format="png"></my-upload>
<img :src="avatar">
js
import myUpload from "vue-image-crop-upload";
export default {
data() {
return {
avatar: "",
show: false
}
},
components: {
"my-upload": myUpload
},
methods: {
toggleShow() {
this.show = !this.show;
},
cropSuccess(imgDataUrl) {
// imgDataUrl其实就是经过base64转码过的图片
this.avatar = imgDataUrl;
}
}
}
