Добрый вечер всем! Тут столкнулся с проблемой при попытке создать

админку из excel-таблицы, хочу её распарсить с помощью npm xlsx от sheetJs.
В итоге получился нужный мне объект, но он виден только внутри async функции. Подскажите как можно его оттуда вытащить чтобы он стал доступен вне этой функции?
Заранее большое спасибо!

Вот мой код:

import { useEffect, useState } from 'react';
import { read, utils } from 'xlsx';

const url = 'adminTable.xlsx';

export default function DataLink() {
useEffect(() => {
(async () => {
const wb = read(await (await fetch(url)).arrayBuffer(), { WTF: 1 });
const data = utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]], { header: 1 });

const dataGpsTable = data.map((el) => (
{
Name: el[0],
Text: el[1],
Price: el[2],
Image: el[3],
}
));
})();
}, []);

useState?

Вроде как внутри у тебя самовызывающаяся функция async, как-то надо понятнее переписать

Получилось, спасибо! Правда теперь он у меня два раза вызывается, сначала пустой, потом уже с данными)

Ну у него на первом рендере дефолтное значение выставляется, а на том, где у тебя данные приходят - с данными)

Сейчас попытался законсолить переменную только если есть данные но консолится почему то всегда, и не могу найти ошибку в цикле. Есть ли возможность еще раз подсказать? Не понимаю где косяк export default function DataLink() { const [dataGpsTable, setDataGpsTable] = useState([]); if (dataGpsTable !== []) { console.log(dataGpsTable, 'данные пришли!'); } useEffect(() => { (async () => { const wb = read(await (await fetch(url)).arrayBuffer(), { WTF: 1 }); const data = utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]], { header: 1 }); setDataGpsTable(data.map((el) => ( { Name: el[0], Text: el[1], Price: el[2], Image: el[3], } ))); })(); }, []);

Данные консолятся всегда вот почему) А про ошибку в цикле я не понял, о чем ты Что за ошибка?

Перепутал с условием, извиняюс) А почему пустой массив не равный пустому массиву это истина? Наоборот же должно быть вроде

У тебя setDataGps в теле компонента?

по сути да, лучше его отдельно вывести?

потому что тип не примитивный у массива)

Это ссылочный тип данных, из-за того что ссылки разные он проверяет они никогда не равны и по этому тру будет

В рендере компонента вызывать setState так себе

Не так код понял, всё ок