Simple and customizable react file input with a11y in mind

综合技术 2019-01-10 阅读原文

React File Button

Simple and customizable react file input with a11y in mind.

Install

yarn add react-file-button
/ npm install react-file-button --save

Use

import FileButton from 'react-file-button';

const customButtonStyle = {
  background: '#0fc',
  fontSize: 18,
  border: 0,
  padding: '20px 40px',
  borderRadius: 4,
  color: '#000',
  display: 'inline-block',
};

 (
    
{files.length ? `Files chosen: ${files.length}` : 'Chose files'}
)} />;

Props

All input props available plus renderButton: (value: string, files: FileList | []) => ReactNode
that renders a custom button. Takes two arguments: value
and files
and should return react node. className
and style
properties will apply on component root (label).

Latest version uses hooks and requires react@16.7.0-alpha.x
to work. You can use 1.x
version if don't want that.

Github

责编内容by:Github阅读原文】。感谢您的支持!