@beisen-phoenix/upload-block

## 功能参数说明 上传功能的实现依赖 [@reacted/use-file-upload]()

Usage no npm install needed!

<script type="module">
  import beisenPhoenixUploadBlock from 'https://cdn.skypack.dev/@beisen-phoenix/upload-block';
</script>

README

上传组件

功能参数说明

上传功能的实现依赖 @reacted/use-file-upload

err? boolean

当传递的err为true时，上传框会显示成一种五颜六色的红色。

示例代码

import React, { useState, useCallback } from 'react';
import UploadBlock, { msgType } from '../../src/index';

export default function Supers() {
  let [error, setError] = useState(false);

  const handleError = msg => {
    console.log(msg);
    setError(true);
    if (msg.type === msgType.overLimit) console.log('文件个数超出上限');
    if (msg.type === msgType.overSize) console.log('文件大小超出上限');
    if (msg.type === msgType.readError) console.log('文件读取错误');
  };

  const handleFileSelect = useCallback(
    files => {
      if (error) {
        setError(false);
      }
      console.log(files);
    },
    [error]
  );

  return (
    <UploadBlock
      err={error}
      onError={handleError}
      onSelect={handleFileSelect}
      multiple
      limit={3}
      sizeLimit={0.0015}
      text="上传"
    />
  );
}