vue一个写法错误,求助

海洋之蓝
  • 100

使用vant中的uploader上传图片,结果总是报错

<van-col span="24">
                    <van-uploader v-model="certificatesimg1" multiple :max-count="1" upload-text="驾驶证" :after-read="afterRead" :name="1"/>
                    <van-uploader v-model="certificatesimg2" multiple :max-count="1" upload-text="行驶证" :after-read="afterRead" :name="2"/>
                </van-col>
                
                .......
                
<srcipt>
.....
methods:{
    afterRead(file,detail) {
                const that = this;
              let fd = new FormData()
              let dname = detail.name
              fd.append('file', file.file)
              axios.post('../api/common/upload', fd, {
                headers: {
                  'Content-Type': 'multipart/form-data',
                  'token': localStorage.getItem('token'),
                }
              }).then(res => {
                that.certificatesimg.dname = res.data.data.url;
              }).catch(err => {
                alert(err)
              })
            },

可以正常上传图片,就是会提示错误
image.png

回复
阅读 292
3 个回答

certificatesimg 没取到。在你提供的代码里面也没有。

你可以自己排查一下这个变量,也可以不相关的代码补全一下

应该是这一句报错了,that.certificatesimg 是 undefined,是否定义了这个变量,赋值是否正确?

that.certificatesimg.dname = res.data.data.url;

完整点代码

<van-col span="24">

                <van-uploader v-model="certificatesimg1" multiple :max-count="1" upload-text="驾驶证" :after-read="afterRead" :name="1"/>
                <van-uploader v-model="certificatesimg2" multiple :max-count="1" upload-text="行驶证" :after-read="afterRead" :name="2"/>
            </van-col>
            
            .......
            

<srcipt>
.....
data() {

        return {
            certificatesimg1: [],
            certificatesimg2: [],
    ......

methods:{

afterRead(file,detail) {
          const that = this;
          let fd = new FormData()
          fd.append('file', file.file)
          axios.post('../api/common/upload', fd, {
            headers: {
              'Content-Type': 'multipart/form-data',
              'token': localStorage.getItem('token'),
            }
          }).then(res => {
            //that.certificatesimg.dname = res.data.data.url;
            that['certificatesimg'+detail.name] = res.data.data.url;
          }).catch(err => {
            alert(err)
          })
        },

我上面的在获取完数据成功后赋值修改为:
that['certificatesimg'+detail.name] = res.data.data.url;

现在报:
vue.runtime.esm.js:1888 TypeError: this.fileList.map is not a function
image.png

图片啥的可以正常上传,就是会报错!

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏