美文网首页
antd+axios上传文件

antd+axios上传文件

作者: LeslieLiang | 来源:发表于2021-06-22 14:32 被阅读0次

HTML部分

<a-upload name="file" list-type="picture-card" :show-upload-list="false"
    class="file-uploader" multiple
    :custom-request="(data) => onFileUpload(data, 'cjtj')">
    <a-icon :type="loading.cjtj ? 'loading' : 'plus'" />
    <div class="ant-upload-text">上传文件</div>
</a-upload>

JS部分

onFileUpload ({ file, name }, type) { // 文件上传
            this.loading[type] = true

            const formData = new FormData()
            formData.append('file', file, name)
            formData.append('type', type)
            const instance = this.$http.create({ withCredentials: true })
            instance.post(this.config.apis.fileUpload, formData, {
                headers: {
                    'x-csrftoken': localStorage.getItem('TOKEN')
                }
            }).then(resp => {
                const { code, msg } = resp.data
                if (code != 200) {
                    this.$message.error(`上传失败.${msg}`)
                }
            }).finally(() => {
                this.loading[type] = false
            })
        }

相关文章

网友评论

      本文标题:antd+axios上传文件

      本文链接:https://www.haomeiwen.com/subject/pytmyltx.html