javascript - 使用 React hook setState 更改数组中的变量

Question

我在更改某个名称的 actif 值时遇到问题。 如果我点击标签“Sport”，我希望“Sport”中的“actif”值更改为1，但我不确定正确的写法是什么，我已经尝试了很多。

const [activeTag, setActivetag] = useState([
        { name: "Music", value: 1, actif: 1 },
        { name: "Sport", value: 2, actif: 0 },
        { name: "VideoGames", value: 3, actif: 0 },
        { name: "Animals", value: 4, actif: 0 },
        { name: "Party", value: 5, actif: 0 },
        { name: "Arts", value: 6, actif: 0 },
        { name: "Movies", value: 7, actif: 0 },
        { name: "Travels", value: 8, actif: 0 },
        { name: "Cooking", value: 9, actif: 0 },
        { name: "Dance", value: 10, actif: 0 },
    ]);

提前致谢!

Answer 1

您可以在 Click 事件上执行类似的操作:

var newArr = [... activeTag]; 
newArr[index] = your_newvalue
setActiveTag(newArr);

已更新，我认为这个更好:

 function onClick() {
   setArr(arr.map((x) => (x.name === "Sport" ? { ...x, actif: 1 } : x)));
 }

CodeSandbox