Soy muy nuevo en JS. Tengo Html como este
<label for="myfile">Select a CSV file:</label><br> <input type="file" id="myfile" name="myfile" class="file-select" accept="text/csv"> Lo que sucede aquí es que permito que el usuario seleccione archivos CSV y los almacene en un objeto llamado myfile .
En JS
const selectedFile = document.getElementById('myfile').files[0]; console.log(selectedFile.name); this.fileName = selectedFile.name; Papa.parse(selectedFile, { skipEmptyLines: true, preview: readRange.numRows > 0 ? readRange.numRows : 0, complete: (results) => { console.log('Finished:', results.data); this.raw = results.data; this.limitColumns(readRange.numCols > 0 ? readRange.numCols : 0); this.header = Array.from(this.raw[0]); // problem: duplicated / null headers this.header.shift(); this.refreshPreview(); this.completed = true; console.log(this.completed);ruta de verificación
myfile.value 'C:\\fakepath\\r.csv'¿¿¿Camino falso???
Entonces, estoy usando la variable myfile de Html y estoy haciendo algunas operaciones en ese archivo CSV ... Hasta ahora, está bien ... Entonces, mi requisito es sin cambiar la fuente. Me asignó mi ruta de archivo personalizada en Js a la variable myfile . me gusta
const mynewfile = "r.csv" const selectedFile = document.getElementById('mynewfile').files[0]; console.log(selectedFile.name); this.fileName = selectedFile.name; Papa.parse(selectedFile, { skipEmptyLines: true, preview: readRange.numRows > 0 ? readRange.numRows : 0, complete: (results) => { console.log('Finished:', results.data); this.raw = results.data; this.limitColumns(readRange.numCols > 0 ? readRange.numCols : 0); this.header = Array.from(this.raw[0]); // problem: duplicated / null headers this.header.shift(); this.refreshPreview(); this.completed = true; console.log(this.completed);Entonces, lo que he hecho aquí es crear una nueva variable y asignar mi disfraz csv para probar. Pero me muestra un error como
vue.js:590 [Vue warn]: Error in v-on handler: "TypeError: Cannot read properties of null (reading 'files')" (found in <Root>)¿Me estoy perdiendo algo aquí?
¿¿¿Camino falso???
Los navegadores no exponen información sobre la estructura del sistema de archivos del visitante a JavaScript que se ejecuta en las páginas web que visitan.
const mynewfile = "r.csv" const selectedFile = document.getElementById('mynewfile').files[0];
No se pueden leer las propiedades de nulo (leyendo 'archivos')"
El mensaje de error significa que document.getElementById('mynewfile') devuelve null porque no hay ningún elemento con el ID mynewfile .
Posiblemente estaba tratando de usar la variable mynewfile (ya que la definió en la línea anterior pero nunca la usó) en lugar de la cadena literal 'mynewfile' , pero eso tampoco funcionará: un nombre de archivo no es lo mismo que la ID le ha dado a su elemento <input> anteriormente en la página.
No hay forma de que usted, como autor de una página web, le diga al navegador (perteneciente al visitante) que lea un archivo de su elección del disco de su visitante.
Eso sería un gran problema de seguridad.
El visitante debe elegir el archivo de una entrada de archivo.