CODEWITHSUNDEEP
javascriptreactjs
Raaz
Raaz

Reputation: 1771

update state from another function with useState

const Room = (props) => {
  const [hasError, setErrors] = useState(false);
  const [rooms, setRooms] = useState([]);

  return (
      <div> <a onClick={() => deleteRoom()}</div>
    )
}

const deleteRoom = () => {
  //How to update setRooms here
}

How do I update setRooms in deleteRoom method?

Upvotes: 0

Views: 73

Answers (3)

gbalduzzi
gbalduzzi

Reputation: 10176

You have 2 options:

  1. Put your deleteRoom method inside the Room component
const Room = (props) => {
  const [hasError, setErrors] = useState(false);
  const [rooms, setRooms] = useState([]);


  const deleteRoom = () => {
    ... use your state..
  }

  return (
      <div> <a onClick={() => deleteRoom()}</div>
    )
}
  1. Pass your useState functions to deleteRoom as arguments.
const Room = (props) => {
  const [hasError, setErrors] = useState(false);
  const [rooms, setRooms] = useState([]);


  return (
      <div> <a onClick={() => deleteRoom(setRooms, setErrors)}</div>
    )
}

const deleteRoom = (setRooms, setErrors) => {
  you can use setRooms() and setErrors() here
}

Upvotes: 0

Erazihel
Erazihel

Reputation: 7605

You simply have to define the deleteRoom function inside the Room component.

const Room = (props) => {
  const [hasError, setErrors] = useState(false);
  const [rooms, setRooms] = useState([]);



  const deleteRoom = () => {
    setRooms(...);
  }

  return (
      <div> <a onClick={() => deleteRoom()}</div>
  )
}

Upvotes: 3

Nikos Chatzivasileiadis
Nikos Chatzivasileiadis

Reputation: 593

You can pass setRooms as an argument in deleteRoom and call it there.

For example

const Room = (props) => {
  const [hasError, setErrors] = useState(false);
  const [rooms, setRooms] = useState([]);

  return (
      <div> <a onClick={() => deleteRoom(setRooms)}</div>
    )
}

const deleteRoom = (setRooms) => {
  //How to update setRooms here
  setRooms(...)
}

Upvotes: 2

Related Questions