@n3/react-fileuploader
    TypeScript icon, indicating that this package has built-in type declarations

    0.6.0 • Public • Published

    @n3/react-fileuploader

    Установка

    npm install @n3/react-fileuploader
    

    API

    Использование

    import FileUploader from '@n3/react-fileuploader';
    
    ...
    
    <FileUploader
      files={files}
      isShow={isShow}
      disabled={disabled}
      multiple={multiple}
      maxLength={maxLength}
      help={help}
      renderFile={renderFile}
      uploadFile={uploadFile}
      onChange={onChangeFiles}
      showDownloadControl={showDownloadControl}
      showRemoveControl={showRemoveControl}
      getControls={getControls}
      isDragAndDrop={isDragAndDrop}
    />

    Props

    Название Обязательность Тип Значение по умолчанию Описание
    disabled bool false Выключено ли поле ввода
    multiple bool true Возможен ли выбор нескольких файлов в инпуте
    maxLength number null Максимальное количество файлов для загрузки (в случае null не ограничено)
    help node null Текст подсказки
    files + arrayOf [
      shape {
      - id
        custom
      - name
        string
      - url
        string
      - size
        number
      - extension
        string
      - isImage
        bool
      - uploadErrors
        union
        - string
        - arrayOf [
            string
          ]
      }
    ]
    Список загруженных файлов
    inputProps object {} Объект дополнительных свойств для input[type="file"] элемента
    isShow bool false Включен ли режим просмотра (отображается только список файлов, по умолчанию нет кнопки удаления)
    isDragAndDrop bool true Показывать ли поле для драг-н-дропа
    renderFile func (fileId, props, FileBlockComponent) => (<FileBlockComponent {...props} key={fileId} />) Функция для переопределения рендера загруженных или загружающихся файлов
    @param {string
    uploadFile + func Асихнхронная функция загрузки файла на сервер
    @async
    @param {File} file - файл для загрузки
    @return {Promise<{id, name, url, size, extension}>} - описание загруженного файла
    onUploadFile func Function.prototype Обработчик успшной загрузки файла
    @param {UploaderFile} file- загруженный файл
    onRemoveFile func Function.prototype Обработчик удаления загруженного файла
    @param {number} fileIndex - индекс файла для удаления
    @param {FileId} fileId - id файла для удаления
    @param {UploaderFile} file - файл для удаления
    onChange func Function.prototype Обработчик изменения списка файлов
    @param {UploaderFile[]} files - новый список файлов
    showDownloadControl bool true Показывать ли кнопку скачивания файла
    showRemoveControl bool true Показывать ли кнопку удаления файла
    getControls func defaultGetControls Функция, создающая конфигурацию кнопок для управления файлом, перекрывает свойства showRemoveControl и showDownloadControl
    @param {Object} params - объект параметров
    @param {UploaderFile} params.file - описание файла
    @param {boolean} params.disabled - выключено ли поле загрузки
    @param {boolean} params.showDownloadControl - описано выше
    @param {boolean} params.showRemoveControl - описано выше
    @param {Function} params.removeFile - функция удаления текущего файла из списка

    PropTypes

    import { fileIdPropType, filePropType } from '@n3/react-fileuploader';
    • fileIdPropType - тип id файла
    • filePropType - тип файла из массива files

    UploadFileError

    Ошибка, которая должна быть вызвана в случае неудачной загрузки файла в функции uploadFile

    import { UploadFileError } from '@n3/react-fileuploader';
    
    const uploadFile = async () {
      ...
    
      throw new UploadFileError([
        'error1',
        'error2',
        'error3',
      ]);
    }
    

    Стили

    Подключение стандартных стилей:

    import '@n3/react-fileuploader/dist/n3-react-fileuploader.css';

    Keywords

    none

    Install

    npm i @n3/react-fileuploader

    DownloadsWeekly Downloads

    14

    Version

    0.6.0

    License

    MIT

    Unpacked Size

    117 kB

    Total Files

    45

    Last publish

    Collaborators

    • v.voloshin
    • n3admin
    • vtaits
    • k.kulik
    • a_sannikov