1.0.6 • Published 3 months ago

@kne/react-file-type v1.0.6

Weekly downloads
-
License
ISC
Repository
github
Last release
3 months ago

react-file-type

描述

显示文件类型图标

安装

npm i --save @kne/react-file-type

概述

根据文件后缀名显示对应的文件图标

示例

示例代码

  • 基本:
  • 支持14种文件格式,如:doc | docx | gif | jpg | mp4 | pdf | png | ppt | pptx | rar | svg | xls | xlsx | zip
  • fileType(@kne/react-file-type),space(antd/lib/space)
const {default: FileType} = fileType;
const {default: Space} = space;
const BaseExample = () => {
    return <Space direction="vertical">
        <div>
            加载PDF文件:
        </div>
        <Space>
            <FileType type="doc"/>
            <FileType type="docx"/>
            <FileType type="gif"/>
            <FileType type="jpg"/>
            <FileType type="mp4"/>
            <FileType type="pdf"/>
            <FileType type="png"/>
            <FileType type="ppt"/>
            <FileType type="pptx"/>
            <FileType type="rar"/>
            <FileType type="svg"/>
            <FileType type="xls"/>
            <FileType type="xlsx"/>
            <FileType type="zip"/>
        </Space>
        <Space direction="vertical">
            <div>自定义尺寸:</div>
            <Space>
                <FileType type="doc" size={30}/>
                <FileType type="doc" size={40}/>
                <FileType type="doc" size={50}/>
            </Space>
        </Space>
        <div>
            不支持的文件格式显示如下:
        </div>
        <div>
            <FileType type="msg"/>
        </div>
    </Space>;
};

render(<BaseExample/>);

API

属性名说明类型默认值
type文件后缀名doc | docx | gif | jpg | mp4 | pdf | png | ppt | pptx | rar | svg | xls | xlsx | zipunknow
size图标大小number40