我有一個型別設定為檔案的輸入元素,我用它來上傳檔案。問題是它也接受影像,但我不希望那樣。我只希望視頻被接受。有辦法解決嗎?
<input
type="file"
id="file"
ref={inputFile}
onChange={(event) => handleVideoUpload(event.target.files[0])}
}
uj5u.com熱心網友回復:
輸入上的接受屬性應該可以完成這項作業:
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept
uj5u.com熱心網友回復:
只需使用接受道具
如果需要額外的驗證步驟 - 您可以在提交/發布之前使用檔案型別檢查條件- MIME ofvideo
一個樣本,例如
const { useRef } = React;
const App = () => {
const fileRef = useRef(null);
const handleVideoUpload = (file) => {
if(!file.type.includes("video")){
alert("not a video and don't submit, just return")
return
}else{
alert("It's a video ... proceed submitting")
}
}
return (
<div>
<input
type="file"
id="file"
accept="video/*"
ref={fileRef}
onChange={(event) => handleVideoUpload(event.target.files[0])}
/>
</div>
);
};
ReactDOM.createRoot(document.getElementById("root")).render(<App />);
<div id="root"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.1.0/umd/react.development.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.1.0/umd/react-dom.development.js"></script>
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/513153.html
標籤:反应视频
