TypeError: client.upload.addEventListener is not a function

itstyren commented 6 years ago

您好，我在使用组件时，点击保存会提示错误如下， default

请问是什么原因呢？我的使用方法如下：


<div class="image-cropper">
<el-button @click="visible=true">设置头像</el-button>
 <my-upload  v-model="visible" :url="'http://upload.qiniu.com/'" :noRotate="false"  :params="postData" @crop-upload-success="successUpload" @crop-upload-fail="failUpload"></my-upload>
 </div>

<script type="text/ecmascript-6">
import "babel-polyfill"; // es6 shim
import myUpload from "vue-image-crop-upload";
export default {
  data() {
    return {
      visible: false,
      // 七牛云令牌
      postData: {
        token: this.$store.getters.qiniuToken
      },
      imageURL: ""
    };
  },
  components: {
    myUpload
  },
  methods: {
    successUpload(jsonData, field) {
      console.log(jsonData);
      this.imageURL = this.$store.getters.qiniuURL + jsonData.key;
    },
    failUpload(status, field) {
      console.log("-------- upload fail --------");
      console.log(status);
      console.log("field: " + field);
    }
  }
};
</script>

<style scoped lang="scss">
.image-cropper {
  width: 100%;
  text-align: center;
}
</style>

kiwilili commented 6 years ago

如果你引用了 mockjs 那么解决办法是 https://github.com/nuysoft/Mock/issues/127

itstyren commented 6 years ago

你好，我这一部分是直接上传到七牛云中，应该没有使用mock。我昨天最后解决办法是将vue-image-crop-upload/upload-2.vue 中的861行直接注释掉了，这样会导致进度条在得到回应之前一直是0%，不过可以正常使用。我刚同样尝试了您链接中的方法，没有效果，不过还是谢谢你。

w19871029 commented 5 years ago

除了注释还有其他的方法吗是写错了用的他们的例子也不行

dai-siki / vue-image-crop-upload

TypeError: client.upload.addEventListener is not a function #103