file input

我有一個表單，其中包含一個文件輸入框，讓用戶上傳圖片： <input name='image' type='file' accept='image/\*' 我需要這個圖片的大小小於3MB。 因此，我將以下代碼添加到React應用程序中的onChange事件中，以實現此要求： <input name='image' type='file' accept='image/\*' onChange={(event) => { if (event.target.files && event.target.files[0]) { if (event.target.files[0].size > 3 \* 1000 \* 1024) { alert('最大允許的大小為3MB') return false } setImage(event.target.files[0]) setImageURL(URL.createObjectURL(event.target.files[0])) } }} />

我有一個需要使用檔案上傳圖片的需求，所以我添加了一個小小的 input type="file" 欄位： <input type="file"> 我只希望使用者能夠上傳圖片。 這是一個常見的需求，但我總是忘記如何實現。 使用 accept 屬性，將 image/* 傳遞進去以允許上傳所有圖片： <input type="file" accept="image/*"> 或者使用 image/png 只允許上傳 PNG 圖片： <input type="file" accept="image/png"> 同樣的語法也可以用於只允許上傳視頻： <input type="file" accept="video/*"> 或者音頻： <input type="file" accept="audio/*"> 或者它們的組合： <input type="file" accept="image/*,audio/*,video/*"> 當然，這只是在客戶端進行的驗證，當接收到檔案時，您也應該在伺服器端驗證媒體類型。