Я новичок в использовании хуков в React. Я пытаюсь получить данные при первом монтировании компонента, используя useEffect () со вторым параметром пустого массива. Затем я пытаюсь установить свое состояние с новыми данными. Это выглядит как очень простой вариант использования, но я, должно быть, делаю что-то не так, потому что DOM не обновляется с новым состоянием.
const [tableData, setTableData] = useState([]);
useEffect(() => {
const setTableDataToState = () => {
fetchTableData()
.then(collection => {
console.log('collection', collection) //this logs the data correctly
setTableData(collection);
})
.catch(err => console.error(err));
};
setTableDataToState();
}, []);
Когда я устанавливаю достаточно большой тайм-аут вокруг вызова setTableData () ( 5 мс не сработали, 5 с сработали), точные данные таблицы будут отображаться, как и ожидалось, что заставило меня подумать, что это может быть проблемой с возвратом моей функции извлечения до того, как коллекция будет фактически готова. Но console.log () перед setTableData () выводит правильную информацию - и я не уверен, как он мог это сделать, если данные не были доступны к этому моменту в коде.
Я надеюсь, что это что-то очень простое, что мне не хватает. Есть идеи?