@Gary_Ihar
JS *овнокодер

Расскажите простым языком пожалуйста. Что тут происходит?

Подскажите пожалуйста, что происходит под капотом реакта? Хочется просто разобраться, а не просто тупо знать решение проблемы. Гуглил, но все вокруг да около
Вариант 1

const [counter, setCounter] = useState(0)

    const clicker = () => {
        setCounter(counter + 1)
        setCounter(counter + 1)
        setCounter(counter + 1)
        setCounter(counter + 1)
    }
    console.log('render')
    return ( 
        <div>
            <div>{counter}</div>
            <button onClick={clicker}>counter</button>
        </div>
    )

Вариант 2

const [counter, setCounter] = useState(0)

    const clicker = () => {
        setCounter(prev => prev + 1)
        setCounter(prev => prev + 1)
        setCounter(prev => prev + 1)
        setCounter(prev => prev + 1)
    }
    console.log('render')
    return ( 
        <div>
            <div>{counter}</div>
            <button onClick={clicker}>counter</button>
        </div>
    );


Вот, что я думаю:
Если идет несколько setCounter(counter + 1) подряд, то реакт просто берет последний и его делает. Если даже передать функцию setCounter(() => counter + 1) и вызывать подряд, то все равно будет последний выполнен. Но как только мы начинаем пользоваться аргументом этой функции setCounter((preState) => preState + 1), то где-то под капотом реакт начинает делать все последовательно и запоминает все действия с этим стейтом.

Могу где-то ошибаться прям оочень сильно, вот поправьте пожалуйста.
  • Вопрос задан
  • 114 просмотров
Пригласить эксперта
Ответы на вопрос 1
mmmaaak
@mmmaaak
Учи что такое замыкания в javascript
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы