解决ant design vue的upload组件@change事件控制台报错

878 阅读1分钟

在使用upload组件的时候上传照片控制台会报错。

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'data')"

debugger调试时发现@change事件会调用3次绑定的函数,前两次时接口是没有返回response数据导致了报错。

在:#Upload file.status is always being uploading 中发现了解决思路,原来它是有状态的!

解决方法:

// @change事件绑定函数
uploadChange(info) {
    // 判断状态
    const status = info.file.status
    if (status !== 'uploading') {
      console.log(info.file, info.fileList)
    }
    if (status === 'done') {
      console.log('file upload done.', info.fileList[0].response)
    } else if (status === 'error') {
      this.$message.error(`${info.file.name} file upload failed.`)
    }
  }