From b2af2ddf02790fc0bb7e6d028cc5e09a45a78b6f Mon Sep 17 00:00:00 2001
From: Pan <panfree23@gmail.com>
Date: Fri, 28 Apr 2017 10:02:45 +0800
Subject: [PATCH] refine avatarUpload demo

---
 src/components/ImageCropper/index.vue |  2 +-
 src/views/components/avatarUpload.vue | 11 ++++++-----
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/ImageCropper/index.vue b/src/components/ImageCropper/index.vue
index 1e60a5d4..2f532c8f 100644
--- a/src/components/ImageCropper/index.vue
+++ b/src/components/ImageCropper/index.vue
@@ -694,7 +694,7 @@
                 // 上传成功
                 function(resData) {
                     that.loading = 2;
-                    that.$emit('crop-upload-success', url);
+                    that.$emit('crop-upload-success', resData);
                 },
                 // 上传失败
                 function(sts) {
diff --git a/src/views/components/avatarUpload.vue b/src/views/components/avatarUpload.vue
index a41558ac..93d99a33 100644
--- a/src/views/components/avatarUpload.vue
+++ b/src/views/components/avatarUpload.vue
@@ -4,13 +4,12 @@
     由于我在使用时它只有vue@1版本，而且有些业务的需求耦合到七牛等等原因吧，自己改造了一下，如果大家要使用的话，优先还是使用官方component
     </code>
 
-    <PanThumb image='https://wpimg.wallstcn.com/577965b9-bb9e-4e02-9f0c-095b41417191'>
+    <PanThumb :image='image'>
     </PanThumb>
     <el-button type="primary" icon="upload" style="position: absolute;bottom: 15px;margin-left: 40px;" @click="imagecropperShow=true">修改头像
     </el-button>
 
-    <ImageCropper :width="300" :height="300" url="https://httpbin.org/post" @crop-upload-success="cropSuccess" :key="imagecropperKey"
-      v-show="imagecropperShow" />
+    <ImageCropper :width="300" :height="300" url="https://httpbin.org/post"  @crop-upload-success="cropSuccess" :key="imagecropperKey" v-show="imagecropperShow" />
   </div>
 </template>
 <script>
@@ -21,13 +20,15 @@
       data() {
         return {
           imagecropperShow: false,
-          imagecropperKey: 0
+          imagecropperKey: 0,
+          image: 'https://wpimg.wallstcn.com/577965b9-bb9e-4e02-9f0c-095b41417191'
         }
       },
       methods: {
-        cropSuccess() {
+        cropSuccess(resData) {
           this.imagecropperShow = false;
           this.imagecropperKey = this.imagecropperKey + 1;
+          this.image = resData.files.avatar;
         }
       }
     };