Есть ли разница между рендерингом функционального компонента с хуками и без них?

Question

Есть ли разница между рендерингом функционального компонента с хуками и без них?

В Java все находится в форме класса.

Если вы хотите использовать любой объект, тогда у вас есть две фазы:

Объявить
Инициализация

Пример:

Объявление: Object a;
Инициализация: a=new Object();

То же самое для концепции массива

Объявление: Item i[]=new Item[5];
Инициализация: i[0]=new Item();

Если вы не дают секцию инициализации, тогда возникает NullpointerException.

1

reactjs

задан martysun25 4 April 2019 в 23:18

1 ответ

Другие вопросы по тегам:

reactjs

Похожие вопросы:

score 0 · Answer 1

Хотя в функциональных компонентах функции воссоздаются при каждом рендеринге, затраты на его производительность намного меньше по сравнению с преимуществами.

Вы можете сослаться на этот пост для более подробной информации: Потеря производительности при создании обработчиков при каждом рендеринге

Однако вы все равно можете оптимизировать, чтобы функции не воссоздались при каждом рендеринге с useCallback или useReducer(depending on whether your updates are complex or not)

const Counter = (props) => {
  console.log("Counter component");

  const [count, setCount] = useState(0);

  const handleIncrease = useCallback(() => {
    setCount(prevCount => prevCount + 1);
  }, [])

  const handleDecrease = useCallback(() => {
    setCount(prevCount => prevCount + 1);
  }, [])

  return (
    <div>
      <button onClick={handleIncrease}>+</button>
      <button onClick={handleDecrease}>-</button>
      <p>{count}</p>
    </div>
  )
}

В приведенном выше примере функции воссоздаются только при начальном рендеринге, и с помощью обратного вызова обновления состояния мы можем обновить состояние и избежать проблем с закрытием