0
const App = () => {
  const [heading, setHeading] = useState("");
  const [img, setImg] = useState("");
  let [count, setCount] = useState(0);
  console.log("Main",count)


  const increment = () => {
    if (count < Data.length-1) {
      setCount(count + 1);
      nextDiv();
    } else {
      setCount(0);
      nextDiv();
    }
  };
  const decrement = () => {
    if (count > 0) {
      setCount(count - 1);
      preDiv();
    } else {
      setCount(Data.length-1);
      preDiv()
    }
  };
  
  const nextDiv = ()=>{
    console.log("nextDiv",count)
  }
  
  const preDiv = ()=>{
    console.log("PreDiv",count)
  }
  
  
  return (
    <>
      <div className="imgBox">
        <Card head={heading} img={img} />;
      </div>
      <div className="btns">
        <button onClick={increment}>Next</button>
        <button onClick={decrement}>Previous</button>
      </div>
    </>
  );
};

whenever i am incrementing it with button suppose main count is 1 then next Div count is 0 and so on and on decrement it is vice versa i want that my main_count and NextDiv count should be same when i change it throgh buttons

Abhishek Rauthan
  • 11
  • 1
    Does this answer your question? [The useState set method is not reflecting a change immediately](https://stackoverflow.com/questions/54069253/the-usestate-set-method-is-not-reflecting-a-change-immediately) – jonrsharpe Apr 12 '23 at 13:03
  • @Abhishek along the answer in the comment above, you can see it visually at React.dev's [rendering-takes-a-snapshot-in-time](https://react.dev/learn/state-as-a-snapshot#rendering-takes-a-snapshot-in-time) and scroll down below the code to see their visual mental model. – Aleksandar Apr 12 '23 at 13:18

0 Answers0