Seleccioné el archivo y lo puse en estado: todo sobre el objeto del archivo funciona correctamente, pero el webkitRelativePath es nulo,
<input type="file" onChange={changeHandler} id="main_img" name="img" style{{display:'none'}} webkitdirectory />//this my input state{//this is my state name:"1112.PNG" lastModified:1645438409236 lastModifiedDate:Mon Feb 21 2022 13:43:29 GMT+0330 (Iran Standard Time) webkitRelativePath:"" size:1158291 type:"image/png" arrayBuffer:ƒ arrayBuffer() {} slice:ƒ slice() {} stream:ƒ stream() {} text:ƒ text() {} }este objeto se obtiene de la entrada: ¿por qué webkit está vacío?
La respuesta corta es que no puede obtener la ruta completa de un archivo con JavaScript. Por razones de seguridad, esto no está permitido en la mayoría de los navegadores.
webkitRelativePath solo funciona en Chrome. Esto permite que un usuario seleccione una carpeta en lugar de archivos, y cada archivo se lee recursivamente. El webkitRelativePath contiene la ruta relativa del archivo dentro de la jerarquía.