гарантированно, что установщик useState будет таким же?

Question

Скажем, я хочу создать часто используемый useInputState хук:

function useInputState(initialValue) {
  const [value, setValue] = useState(initialValue);
  const onChange = useCallback(
    e => setValue(e.target.value), 
    [ /* ??? */ ]
  );
  return { value, onChange };
}

Нужно ли мне добавить функцию установки setValue к зависимостям обратного вызова?Можем ли мы рассчитывать, что сеттер всегда останется прежним?Кажется, это работает, когда я пытаюсь, но это хорошая практика?Или мы должны предполагать, что НИЧЕГО в закрытии обратного вызова может измениться и повлиять на его реализацию?

(я могу вспомнить больше примеров, которые в конечном итоге поднимают тот же вопрос)

Answer 1

Да, установщик из useState и аналогично отправка из useReducer не изменяются.

Эта часть документов охватывает шаблон прохождения метода dispatchк компонентам-потомкам через контекст и содержит следующее:

Если вы также используете контекст для передачи состояния, используйте два разных типа контекста - контекст отправки никогда не меняется , поэтому компонентыкоторые читают это, не должны перерисовываться, если они также не нуждаются в состоянии приложения.

Answer 2

Да, useState установщик состояния - это та же функция;даже если этого не произойдет, ожидается обновление состояния.Предполагается, что он будет использоваться, как показано в вопросе.

Общее использование лучше объяснено в useReducer документации :

useReducer также позволяет оптимизировать производительностьдля компонентов, которые запускают глубокие обновления, потому что вы можете передавать диспетчер вместо обратного вызова.

И useState использует useReducer внутренне .

Проблемы собласть, в которой был вызван useState, применима только к значению состояния useState, которое остается неизменным в области обратного вызова, где оно используется, например, эта проблема .В случае использования текущего состояния, оно должно быть получено с помощью функции обновления состояния, например setValue(currentState => currentState + 1).