yel*_*eln 5 javascript reactjs react-dropzone dropzone
当我上传文件时,我的react-dropzone 'accept': { .. }参数似乎被完全忽略。
我的useDropzone({}):
const {getRootProps, getInputProps, isDragActive} = useDropzone({
onDrop,
noClick: true,
'accept': {
'video/mp4': ['.mp4', '.MP4'],
},
})
Run Code Online (Sandbox Code Playgroud)
我的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)
})
}, [])
Run Code Online (Sandbox Code Playgroud)
代码:
let test = acceptedFiles.length || rejectedFiles.length
? `Accepted ${acceptedFiles.length}, rejected ${rejectedFiles.length} files`
: "Try dropping some files.";
Run Code Online (Sandbox Code Playgroud)
总是返回:
Accepted 1, rejected 0 files
无论如何,即使我上传,等等,rejected也永远如此0pdfjpgtxt
这是codesandbox链接: https://codesandbox.io/s/kind-frost-zmyhd8 ?file=/pages/index.js
有人知道我的代码有什么问题吗?
根据文档,您需要提供如下所示的接受属性(不带引号):
useDropzone({
accept: {
'video/mp4': ['.mp4', '.MP4'],
}
})
Run Code Online (Sandbox Code Playgroud)
这是工作解决方案。
| 归档时间: |
|
| 查看次数: |
10076 次 |
| 最近记录: |