Как я могу извлечь определенные столбцы из файла CSV с помощью papaparse и отобразить их с помощью React? ⇐ Javascript
-
Гость
Как я могу извлечь определенные столбцы из файла CSV с помощью papaparse и отобразить их с помощью React?
Я работаю над приложением React, и у меня есть файл CSV, содержащий данные в структурированном формате. Я хочу извлечь определенные столбцы из этого CSV-файла и отобразить их в таблице в моем приложении React. Вот как выглядят данные CSV:
1. Сводка,,,,,, Название собрания,TestMeeting,,,,, Присутствовавшие участники,3,,,,,, Время начала, "18.09.23, 16:15:08",,,,, Время окончания, "18.09.23, 16:17:41",,,,, Продолжительность встречи,2м 33с,,,,, Среднее время присутствия,2м 9с,,,,, ,,,,,,, 2. Участники, ,,,,, Имя, Первое присоединение, Последний выход, Продолжительность собрания, Электронная почта, Идентификатор участника (UPN), Роль "sdadadi, dsada", "18.09.23, 16:15:17","9 /18/23, 16:17:38",2м 20с,sdadsad@ert.com,asSas@asAS.com,Организатор "SSAS, Udfsdf","18.09.23, 16:15:27", "18.09.23, 16:17:41", 2 мин 13 с,fsdfsdf@dfsdf.com,fsdfdsfsdf@dsfsf.com,ведущий "dsfsdsf, fsdfsf","18.09.23, 16:15:45 ","18.09.23, 16:17:38",1м 53с,dsfsdfsf@fsdfsf.com,dsfsdfsf@fsdfs.com,Presenter ,,,,,, .... ....
Я специально хочу извлечь столбцы «Имя» и «Электронная почта» и отобразить их в таблице React. Как я могу добиться этого с помощью React и JavaScript?
Я уже пробовал использовать papaparse, изменять значения массива и применять фильтры, но столкнулся с проблемами. Будем очень признательны за любую помощь или рекомендации о том, как правильно анализировать и отображать эти данные в React!
код:
импортировать Папу из papaparse; импортировать React, { useEffect, useState } из «реагировать»; функция Посещаемость() { const [columnArray, setColumn] = useState([]); const [данные, setData] = useState([]); const [пустой, setEmpty] = useState(false); const handleFile = (событие) => { константный файл = event.target.files[0]; Папа.parse(файл, { заголовок: правда, пропуститьEmptyLines: правда, завершено: функция (результат) { const columns = Object.keys(result.data[0]); console.log(Object.values(result.data)); setData(result.data); setColumn (столбцы); setEmpty (истина); }, }); }; возвращаться ( Загрузка отчета о посещаемости Загрузить {пустой && ( {columnArray.map((col, i) => ( {col} ))} {data.map((строка, rowIndex) => ( {columnArray.map((col, colIndex) => ( {row[col]} ))} ))} )} ); } экспортировать посещаемость по умолчанию;```
Я работаю над приложением React, и у меня есть файл CSV, содержащий данные в структурированном формате. Я хочу извлечь определенные столбцы из этого CSV-файла и отобразить их в таблице в моем приложении React. Вот как выглядят данные CSV:
1. Сводка,,,,,, Название собрания,TestMeeting,,,,, Присутствовавшие участники,3,,,,,, Время начала, "18.09.23, 16:15:08",,,,, Время окончания, "18.09.23, 16:17:41",,,,, Продолжительность встречи,2м 33с,,,,, Среднее время присутствия,2м 9с,,,,, ,,,,,,, 2. Участники, ,,,,, Имя, Первое присоединение, Последний выход, Продолжительность собрания, Электронная почта, Идентификатор участника (UPN), Роль "sdadadi, dsada", "18.09.23, 16:15:17","9 /18/23, 16:17:38",2м 20с,sdadsad@ert.com,asSas@asAS.com,Организатор "SSAS, Udfsdf","18.09.23, 16:15:27", "18.09.23, 16:17:41", 2 мин 13 с,fsdfsdf@dfsdf.com,fsdfdsfsdf@dsfsf.com,ведущий "dsfsdsf, fsdfsf","18.09.23, 16:15:45 ","18.09.23, 16:17:38",1м 53с,dsfsdfsf@fsdfsf.com,dsfsdfsf@fsdfs.com,Presenter ,,,,,, .... ....
Я специально хочу извлечь столбцы «Имя» и «Электронная почта» и отобразить их в таблице React. Как я могу добиться этого с помощью React и JavaScript?
Я уже пробовал использовать papaparse, изменять значения массива и применять фильтры, но столкнулся с проблемами. Будем очень признательны за любую помощь или рекомендации о том, как правильно анализировать и отображать эти данные в React!
код:
импортировать Папу из papaparse; импортировать React, { useEffect, useState } из «реагировать»; функция Посещаемость() { const [columnArray, setColumn] = useState([]); const [данные, setData] = useState([]); const [пустой, setEmpty] = useState(false); const handleFile = (событие) => { константный файл = event.target.files[0]; Папа.parse(файл, { заголовок: правда, пропуститьEmptyLines: правда, завершено: функция (результат) { const columns = Object.keys(result.data[0]); console.log(Object.values(result.data)); setData(result.data); setColumn (столбцы); setEmpty (истина); }, }); }; возвращаться ( Загрузка отчета о посещаемости Загрузить {пустой && ( {columnArray.map((col, i) => ( {col} ))} {data.map((строка, rowIndex) => ( {columnArray.map((col, colIndex) => ( {row[col]} ))} ))} )} ); } экспортировать посещаемость по умолчанию;```
Мобильная версия