Бесконечно обновляется useState

Question

import React, {useState} from "react";

import SearchField from "../searchFIeld";
import Table from "../table";
import DateWidget from "../dataWidget";
import NbRBServices from "../../services/services";

import './app.css';

const App = () => {
    const nbRB = new NbRBServices();
    const [dataUSD, setDataUSD] = useState([])

    nbRB.getDataUSD()
        .then((elem) => {
            setDataUSD({elem})
        })

    console.log(dataUSD)

    return(
        <div className='app'>
            <SearchField />
            <Table  />
            <DateWidget />
        </div>

    )
}

export default App

Почему бесконечно выводиться это, хотя по-сути не должно

Answer 1

функция App - по сути это функция, которая вызывается каждый раз когда изменяется состояние.

Таким образом при вызове setDataUSD заново вызывается функция App, снова вызывается сервис, получающий данные, снова вызывается setDataUSD и так по кругу.

Для того, чтобы получить данные только один раз, достаточно перенести вызов сервиса внутрь useEffect с пустым списком зависимостей:

const [dataUSD, setDataUSD] = useState([])

useEffect(()=> {
    const nbRB = new NbRBServices();
    nbRB.getDataUSD()
        .then((elem) => {
            setDataUSD({elem})
        });
}, []);

БЛОГ НА HUSL

Бесконечно обновляется useState

Ответы (1 шт):