Sobes.tech
Back to tasks
Junior — Senior
23

Проверка ререндеринга при клике на вторую кнопку в React

Get help with live coding in real time with Sobes Copilot
Task condition

Нужно выяснить, произойдёт ли повторный рендер компонента, когда пользователь нажимает на кнопку, отвечающую за изменение свойства name во втором состоянии.

import { useCallback, useEffect, useMemo, useState } from "react";

export function App() {
  const [count, setCount] = useState(0);
  const [count2, setCount2] = useState({
    name: 'Anton',
  });

  const handleBtnClick2 = () => {
    count2.name = 'Alex';
  };

  const btnClick = () => {
    setCount(count + 1);
  };

  const handleBtnClick = useCallback(() => {
    btnClick();
  }, []);

  return (
    <div>
      <button onClick={handleBtnClick}>{count}</button>
      <button onClick={handleBtnClick2}>{count2.name}</button>
      {/* <button onClick={btnClick2}>Compute Heavy</button> */}
      <div />
      <input type="text" />
    </div>
  );
}