Ленивое начальное состояние - где его использовать?

Question

Я новичок, чтобы реагировать Крючки! Я пытаюсь использовать useState в моем коде. Пока я его использовал, я нашел термин «Ленивое начальное состояние»Ленивая инициализация состояния будет полезна!

Как, скажем, мой DOM выполняет рендеринг, и ему необходимо значение state , но мой useState еще не инициализировал его !! И скажите, что если вы выполнили рендеринг DOM, и useState ExорогоComputation завершится, DOM будет перерисован !!

Любая помощь будет полезна!

Answer 1

Аргумент, переданный useState, является initialState, значением, которое инициализирует ваше состояние при первом рендеринге и не учитывается при последующих рендерингах. Проблема в том, что когда у вас следующая ситуация

const Component = () =>{
    const [state, setState] = useState(getInitialHundredItems())
}

Представьте, что этот вызов вызывается при каждом рендеринге без необходимости (помните, что хотя начальное значение игнорируется при следующих рендерах, функция, которая его инициализирует, все равно вызывается).

Для таких случаев использования, как это, вместо того, чтобы просто указать значение, которое вы можете передать function, которое возвращает начальное состояние, эта функция будет выполняться только один раз (начальный рендеринг), а не на каждом рендере, как приведенный выше код

const Component = () =>{
    const [state, setState] = useState(() => getInitialHundredItems())
}