Почему счетчик компонента отображается два раза?

Question

Здесь У меня есть пример. Почему в Counter компонент renderRadioGroup отображается два раза при монтировании или даже при каждом изменении (т. Е. Увеличение / уменьшение / выбор радиосвязи)?

Пример включает в себя счетчик с действиями увеличения / уменьшения / установки такими, что его состояние сохраняется в избыточном, а компонент Counter использует useCallback ловушку для кэширования внутренних функций.

Вы можете увидеть количество рендеров в консоли.

Answer 1

то, что вы возвращаете, отображается первым, затем после монтирования компонента - это еще один рендеринг.

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