Tengo una pregunta sobre la validación de mi archivo en ReactJS.
Tengo otra declaración if en mi código. Cuando pruebo el siguiente código y subo una imagen con jpg/png, consola.log ("1st").
const fileChange = e => { 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") } }Pero cuando probé el código a continuación, consola.log("1st") en lugar de console.log("3rd").
const fileChange = e => { 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") } }¿Por qué mi primer código funcionó y el segundo no?
Esta respuesta es muy simple explicando tu pregunta.
const fileChange = e => { if(e.target.files.length < 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 } }o si solo desea verificar la extensión válida de una sola vez, puede usar la siguiente idea de fragmento, por ejemplo
const isValidFileUploaded=(file)=>{ const validExtensions = ['png','jpeg','jpg'] const fileExtension = file.type.split('/')[1] return validExtensions.includes(fileExtension) } const fileChange = e => { if(e.target.files.length < 1){ return; } const file = e.target.files[0]; if(isValidFileUploaded(file)){ //file is valid }else{ //file is invalid } }