0

I have two states in my component, I passed the 'updateStatus function', 'strikeThroughToggle function' and 'strikeThrough' state to my Child component. When i click on the button in my Child component, i want it to call the 'strikeThroughToggle function' which toggles the 'strikeThrough state' and pass the current state to my "updateStatus function". However, when i click on the button, the 'updateStatus function' gets called before my state changes, hence, using the previous state value. Please what do i need to do

function Create() {
  
  const [users, setUsers] = useState([]);
  const [strikeThrough, setStrikeThrough] = React.useState(false);



  const strikeThroughToggle = () => {
    setStrikeThrough(!strikeThrough);
    
  };

  const handleSubmit = (e) => {
    e.preventDefault();

    setUsers([...users, { id: nextId++, name, status: "false" }]);
   
  };

 


  const updateStatus = (id, status) => {
    console.log("updateStatus called");
    const index = users.findIndex((item) => item.id === id);

    const newUsers = [...users];

    newUsers[index] = { ...newUsers[index], status: String(status) };

    setUsers(newUsers);
  };

<Child strikeThrough={strikeThrough} updateStatus={updateStatus} strikeThroughToggle={strikeThroughToggle}/> 

//button in Child component
<button onClick={() => {
        props.strikeThroughToggle();
        props.updateStatus(props.id, String(props.strikeThrough));
      }}>Update </button>
oladimeji
  • 71
  • 1
  • 10

0 Answers0