Блог

Вместо использования useMemo я просто определяю объект «человек» вне компонента. которые устраняют проблему ненужного повторного запроса для изменения реквизитов

App.js

 import React, { useState } from "react";
import Child from "./Child";

let person = { fname: "mahabub", lname: "shaon" };
export default function App() {
  const [state, setState] = useState(0);
  console.log("rendering parent");

  return (
    <>
      <button onClick={() => setState(state   1)}>click to render</button>
      <Child person={person} />
    </>
  );
}
 

Child.js

 import React from "react";

function Child({ person }) {
  console.log("rendering child");
  return (
    <h1>
      {person.fname} {person.lname}
    </h1>
  );
}
export default React.memo(Child);
 

Это нормально или какие-то недостатки этого подхода?