导入文件 -- 调用后端接口传参formdata

Posted 2022-11-02 zlzbt

html代码

<Dragger ...allProps>
    <div className=styles.title>点击或将文件拖拽到这里上传</div>
    <div className=styles.subTitle>支持扩展名: .qplay</div>
</Dragger>

选择的文件。

onChange: async (info) => 
      const  status, originFileObj  = info.file;
      const name = originFileObj.name.split('.');
      if (status === 'done') 
        const file = new File([originFileObj], name,  type: originFileObj.type );
        const formData = new FormData();
        formData.append('file', file);
        const data = await playbackImport(formData);
        console.log(data);
        if (data.success === false) 
          message.error(data.message || data.code);
        
        uploadCancel();
       else if (status === 'error') 
        message.error(`$info.file.name file upload failed.`);
      
    ,

往后端发请求

export const api= async (formData: any) => 
  try 
    return await request<Record<string, any>>(`$basePlaybackURL/import`, 
      method: 'POST',
      data: formData,
    );
   catch (err: any) 
    return err.info;
  
;