账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    关于Upload上传功能 antd
    32
    0

    前端这边上传成功,接口状态都200了,但是后台同事在服务器里面找不到前端上传成功的文件,不知为什么

    const props_ = {
      name: 'file',
      directory: true,
      action: 'http://172.16.238.58:10304/ssgz/swagger-UploadhjCCB',
      onChange(info) {
        if (info.file.status === 'done') {
          message.success(`${info.file.name} 文件上传成功`);
        } else if (info.file.status === 'error') {
          message.error(`${info.file.name} 文件上传失败`);
        }
      },
    };
    
    render() {
     return (
       <Upload {...props_}>
         <Button>
           <Icon type="upload" />上传
         </Button>
       </Upload>
     )
    }
    
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 孤舟蓑笠翁 普通会员 1楼

      在Ant Design中,Upload组件主要用于处理文件上传的场景。以下是一个简单的使用示例:

      首先,你需要在<Upload>组件的action属性中指定一个回调函数,这个函数会在文件上传成功或者失败时被调用。这个回调函数的参数是一个数组,包含了所有的上传文件的信息,如namesizetype等。

      javascript <Upload action="handleFileUpload" multiple> <Upload.File name="file1" size={1024} type="file" /> <Upload.File name="file2" size={1024} type="file" /> </Upload>

      在上述代码中,handleFileUpload函数会被调用,它会接收一个数组作为参数,这个数组包含了两个文件的信息。

      handleFileUpload函数的代码如下:

      javascript export default function handleFileUpload(fileList) { // 文件上传成功或失败的回调函数 if (fileList.length === 0) { // 处理文件数量为0的情况 console.log('No files uploaded.'); return; } console.log('File上传成功:', fileList[0]); }

      在这个函数中,我们首先检查文件数量是否为0。如果是,我们打印一条消息并返回。否则,我们打印上传成功的文件信息。

      注意:<Upload>组件默认会在<Form>组件的submit事件中触发文件上传,如果你想要在<Form>组件的upload事件中触发文件上传,你需要将<Upload>组件的action属性的值改为"upload"

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部