## DageUpload 文件上传

### 图片上传用法

图片上传完成后，`file`会携带`imgAttrs`图片属性（**仅在新上传的图片存在**）

```tsx
import React, { useCallback, useState } from "react";
import { message } from "antd";
import { DageUpload, DageFileResponseType } from "@dage/pc-components";
// 接口初始化
import "../../configure";

export default () => {
  const [value, setValue] = useState<DageFileResponseType[]>([]);

  const handleChange = useCallback(
    (list: DageFileResponseType[], file: DageFileResponseType) => {
      setValue(list);

      if (file.status === "done" && file.imgAttrs) {
        // imgAttrs 只会在新上传时获取
        message.info(
          `width:${file.imgAttrs.width};height:${file.imgAttrs.height}`
        );
      }
    },
    []
  );

  return (
    <DageUpload
      value={value}
      maxCount={2}
      maxSize={20}
      action="/api/cms/goods/upload"
      tips="支持png、jpg和jpeg格式；最大20M，最多2张"
      onChange={handleChange}
    />
  );
};
```

### 模型上传用法

```tsx
import React, { useCallback, useState } from "react";
import {
  DageUpload,
  DageUploadType,
  DageFileResponseType,
} from "@dage/pc-components";

export default () => {
  const [value, setValue] = useState<DageFileResponseType[]>([]);

  const handleChange = useCallback((list: DageFileResponseType[]) => {
    setValue(list);
  }, []);

  return (
    <DageUpload
      value={value}
      maxCount={2}
      maxSize={20}
      dType={DageUploadType.MODEL}
      action="/api/cms/goods/upload"
      onChange={handleChange}
    />
  );
};
```

### 音频上传用法

```tsx
import React, { useCallback, useState } from "react";
import {
  DageUpload,
  DageUploadType,
  DageFileResponseType,
} from "@dage/pc-components";

export default () => {
  const [value, setValue] = useState<DageFileResponseType[]>([]);

  const handleChange = useCallback((list: DageFileResponseType[]) => {
    setValue(list);
  }, []);

  return (
    <DageUpload
      value={value}
      maxCount={2}
      maxSize={20}
      dType={DageUploadType.AUDIO}
      action="/api/cms/goods/upload"
      onChange={handleChange}
    />
  );
};
```

## API

<API hideTitle exports='["DageUpload"]' src='@dage/pc-components/index.d.ts'></API>

## DageUploadContext

| Name      | Description | Type      | Default |
| --------- | ----------- | --------- | ------- |
| uploading | 上传中      | `boolean` | `false` |
