Buk Lau
Buk Lau

Reputation: 1630

push an element to an array with useState hooks

Im trying to push new tag in useState how possible i can do that

const [mydata, setData] = useState({
    user_gender: "",
    user_relationship: "",
    user_birth_day: "",
    user_birth_month: "",
    user_gender_interest: "",
    user_birth_year: "",
    tags: []
  });

const handleAddChip = chip => {
    setData({
      ...mydata,
      tags: chip
    });
  };

Upvotes: 1

Views: 7732

Answers (1)

Dupocas
Dupocas

Reputation: 21357

Use the updater version of the setter provided by useState and concat to return a new array instead of push

const handleAddChip = chip => {
    setData(previousData =>({
       ...previousData,
       tags: previousData.tags.concat(chip)
     }));
};

You can also do it without the updater version, but usually isn't a good idea.

setData({...myData, tags: myData.tags.concat(chip)})

Upvotes: 4

Related Questions