1

I currently have two arrays which updates based on the onClick event. I want to keep track of this array updates through useMemo ,I want to know which array is getting updated on every click but I want to execute separate function for each array when they are clicked , now I can see code inside useMemo is getting executed for both the click. how to achieve this.

Please refer to code here

import { useEffect, useMemo, useState } from "react";
import "./styles.css";

export default function App() {
  const [array1, setArray1] = useState([]);
  const [array2, setArray2] = useState([]);

  useMemo(() => {
// execute a certain function only when array1 is changed and vis versa
    console.log(array1);
  }, [array1, array2]);
  return (
    <div className="App">
      <h3>on button click I want log output when only "array1" is pressed </h3>
      <button onClick={() => setArray1([1])}>array1</button>
      <button onClick={() => setArray2([2])}>array2</button>
    </div>
  );
}
Divakar R
  • 773
  • 1
  • 8
  • 36

0 Answers0