#javascript #reactjs
Вопрос:
У меня есть вопрос относительно проверки моего файла на ReactJS.
У меня в коде есть оператор else if. Когда я пробую приведенный ниже код и загружаю изображение в формате jpg/png, он console.log(«1-й»).
const fileChange = e =gt; { const file = e.target.files[0]; if(file === undefined) { console.log("undefined") } else if(file.type === "image/png" || file.type === "image/jpeg") { console.log("1st") } else { console.log("3rd") } } Но когда я попробовал приведенный ниже код, он console.log(«1-й») вместо console.log(«3-й»).
const fileChange = e =gt; { const file = e.target.files[0]; if(file === undefined) { console.log("undefined") } else if(file.type !== "image/png" || file.type !== "image/jpeg") { console.log("1st") } else { console.log("3rd") } } Почему сработал мой первый код, а не второй?
Комментарии:
1. Журнал консоли
file.type, чтобы увидеть, что он возвращает2. Подумайте о том, чтобы произнести вслух неудачное утверждение if: «если файл. тип не png или тип файла не jpeg, печать 1-го».
Ответ №1:
Этот ответ очень просто объясняет ваш вопрос
const fileChange = e =gt; { if(e.target.files.length lt; 1){ return; } const file = e.target.files[0]; switch(file.type){ case 'image/png': //('image type is png'); break; case 'image/jpg': //('image/jpg') break; case 'image/jpeg': //('image is jpeg') break; default: // image extension is not valid } } или, если вы хотите проверить действительное расширение только за один раз, вы можете использовать следующую идею фрагмента, например
const isValidFileUploaded=(file)=gt;{ const validExtensions = ['png','jpeg','jpg'] const fileExtension = file.type.split('/')[1] return validExtensions.includes(fileExtension) } const fileChange = e =gt; { if(e.target.files.length lt; 1){ return; } const file = e.target.files[0]; if(isValidFileUploaded(file)){ //file is valid }else{ //file is invalid } }