reactjs react-dropzone接受所有上传的文件类型,而不是“accept”参数中指定的文件类型

qij5mzcb  于 2022-11-22  发布在  React
关注(0)|答案(1)|浏览(271)

我的react-dropzone'accept': { .. }参数似乎完全被忽略,当我上传文件。
我的useDropzone({})

const {getRootProps, getInputProps, isDragActive} = useDropzone({
        onDrop,
        noClick: true,
        'accept': {
            'video/mp4': ['.mp4', '.MP4'],
        },
    })

我的onDrop回电:

const onDrop = useCallback((acceptedFiles, rejectedFiles) => {

        let test =  acceptedFiles.length || rejectedFiles.length
            ? `Accepted ${acceptedFiles.length}, rejected ${rejectedFiles.length} files`
            : "Try dropping some files.";

        console.log(test);

        if (acceptedFiles.length > 0) {
            setSelectedFiles(acceptedFiles);
        }

        acceptedFiles.forEach((file, index, array) => {

            const reader = new FileReader()

            reader.onabort = (event) => {
                console.log('file reading was aborted')
            }

            reader.onerror = (event) => {
                console.log('file reading has failed')
            }

            reader.onload = (event) => {

                // Do whatever you want with the file contents
                const binaryStr = reader.result
                console.log(binaryStr)

            }

            reader.readAsArrayBuffer(file)

        })

    }, [])

代码:

let test =  acceptedFiles.length || rejectedFiles.length
            ? `Accepted ${acceptedFiles.length}, rejected ${rejectedFiles.length} files`
            : "Try dropping some files.";

一律传回:Accepted 1, rejected 0 files
无论如何,rejected将始终是0,即使我上传了pdfjpgtxt
下面是代码sandbox链接:https://codesandbox.io/s/kind-frost-zmyhd8?file=/pages/index.js
有人知道我的代码有什么问题吗?

sulc1iza

sulc1iza1#

根据文档,您需要提供如下接受道具(不带引号):

useDropzone({
  accept: {
    'video/mp4': ['.mp4', '.MP4'],
  }
})

Here是工作溶液。

相关问题