Блог

Я пытаюсь создать загрузку файлов для файлов STL. Приведенный ниже код работает так же, как и в функции onDrop в консоли.журнал показывает пустой массив для всех других типов файлов и файлов, если они имеют тип STL. Итак, он делает то, что должен делать.

Однако строка

 {isDragReject amp;amp; 'File type not accepted, sorry!'}
 

всегда срабатывает, даже для файлов stl. Что, безусловно, смутило бы пользователя.

 import React, { useCallback } from 'react';
import Dropzone, { useDropzone } from 'react-dropzone';

const FileDropzone = () => {
const maxSize = 100000000;

const onDrop = useCallback((acceptedFiles) => {
    console.log(acceptedFiles);
}, []);

const {
    isDragActive,
    getRootProps,
    getInputProps,
    isDragReject,
    acceptedFiles,
    rejectedFiles,
} = useDropzone({
    onDrop,
    accept: '.stl',
    minSize: 0,
    maxSize,
});

const isFileTooLarge =
    rejectedFiles amp;amp;
    rejectedFiles.length > 0 amp;amp;
    rejectedFiles[0].size > maxSize;

return (
    <div className="container text-center mt-5">
        <div {...getRootProps()}>
            <input {...getInputProps()} />
            {!isDragActive amp;amp; 'Click here or drop a file to upload!'}
            {isDragActive amp;amp; !isDragReject amp;amp; "Drop it like it's hot!"}
            {isDragReject amp;amp; 'File type not accepted, sorry!'}
            {isFileTooLarge amp;amp; (
                <div className="text-danger mt-2">File is too large.</div>
            )}
        </div>
    </div>
);
};

export default FileDropzone;
 

Это ошибка, пожалуйста, смотрите подробности здесь: https://github.com/react-dropzone/react-dropzone/issues/888

Решение: понизить уровень до предыдущей версии DropZone.