Sobes.tech
Back to tasks
Junior — Senior
26

Сохранение объекта класса между рендерами через useRef

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

Проведём эксперимент, чтобы увидеть, сохраняет ли хук useRef один и тот же экземпляр класса после каждой перерисовки компонента и меняется ли значение свойства creationTime. В конструкторе и при каждом рендере выводятся соответствующие данные в консоль.

import { useRef, useState } from "react";

class MyClass {
  public creationTime;
  constructor(value: number) {
    this.creationTime = value;
    console.log(value);
  }
}

export default function MyComponent() {
  const classInstanceRef = useRef(new MyClass(new Date().getTime()));
  const [, triggerRender] = useState<Symbol>(Symbol());

  console.log(classInstanceRef.current.creationTime);

  return (
    <div>
      <h1>Hello world</h1>
      <button onClick={() => triggerRender(Symbol())}>
        update state
      </button>
    </div>
  );
}