useUpload

这个组件主要适用于 TDesign Upload 组件,并提供了适配的 Hook,返回的参数可以直接作为该组件的参数。

引入组件

import { useUpload } from '@duxweb/dux-refine'

基础示例

import { useUpload } from '@duxweb/dux-refine'
import { Upload } from 'tdesign-react/esm'

const uploadParams = useUpload()
<Upload {...uploadParams} theme='image' accept='image/*' />

数据转换

你可以使用 formatUploadSingle 方法将字符串 URL 转换为上传组件的 files 参数。

import { formatUploadSingle } from '@duxweb/dux-refine'

const files = formatUploadSingle("http://....jpg")

你也可以使用 getUploadSingle 方法将 files 参数转换为字符串 URL。

import { getUploadSingle } from '@duxweb/dux-refine'

const url = getUploadSingle(files)

返回数据

上传结果的 API 需要在 data 字段中返回文件信息,示例如下:

{
  "code": 200,
  "message": "ok",
  "data": [
      {
        "url": "http://...",
        "name": "Image",
        "ext": "jpg",
        "size": 1024,
        "mime": "image/jpeg"
      }
  ]
}