DropZone フォームがありますが、1つの例外を除いて完全に機能します。ファイルタイプを必要に応じて正確に制限することはできません。
acceptedFiles: "image/*"
を使用すると、イメージではないすべてのフォルダーとファイルの種類が淡色表示されます。 [〜#〜] tiff [〜#〜]は含まれていますが、排他的にに減らす必要があります[ 〜#〜] jpg [〜#〜]および[〜#〜] png [〜#〜]。そこには多くの試行錯誤がありませんでした。
私が試したもの:
acceptedFiles: "image/jpg"
acceptedFiles: ".jpeg,.jpg,.png"
acceptedFiles: "image/jpg,png"
しかし、それらはすべてすべてを選択可能にします。
[〜#〜] jpg [〜#〜]および[〜#〜]の正しいフォーマットは何ですかpng [〜#〜]?
より多くの試行錯誤により、最終的にソリューションが判明しました。
Dropzone.options.dzone = {
acceptedFiles: "image/jpeg,image/png,image/gif"
}
どうやら私のエラーは主にjpgを使用していたため、すべてが失敗しました。上記は魅力のように機能します。
コントローラからも検証する必要があると思います。
$this->validate($request, [
'file' => 'required|mimes:jpg,jpeg,png,bmp']
);
<Dropzone
onDrop={this.handleFilesUpload}
>
{({ getRootProps, getInputProps }) => (
<div {...getRootProps()}>
<input
{...getInputProps()}
accept=".csv" /*you can use any file type */
/>
<div className="drag-container">
<img
className="drag-img"
src={Drag}
alt="drag-img"
/>
<p className="drag-container-para">Drop files here, or click to select files</p>
</div>
</div>
)}
</Dropzone>