如何在reactjs中更新数组的状态

我有一系列按钮的可见性。我正在将这些按钮的状态保存到状态

this.state = {
  score: 0,
  status: "",
  userSelected: "",
  computerSelected: "",
  visibility: [true, true, true]
};

我想按索引更新可见性数组的值。我试着像下面这样做，但它并没有更新，它一直在数组中添加新元素，而不是更新数组的值

var arrayvar = this.state.visibility.slice();
if (
  (user === "Rock" && computer === "Paper") ||
  (user === "Paper" && computer === "Rock")
) {
  arrayvar.push(true, true, false); // here set 1st and 2nd to true and 3rd to false
} else if (
  (user === "Rock" && computer === "Scissors") ||
  (user === "Scissors" || computer === "Rock")
) {
  arrayvar.push(true, false, true);
} else if (
  (user === "Paper" && computer === "Scissors") ||
  (user === "Scissors" || computer === "Paper")
) {
  arrayvar.push(false, true, true);
} else if (user === "Rock" && computer === "Rock") {
  arrayvar.push(true, false, false);
} else if (user === "Paper" && computer === "Paper") {
  arrayvar.push(false, true, false);
} else if (user === "Scissors" && computer === "Scissors") {
  arrayvar.push(false, false, true);
}
this.setState({ visibility: arrayvar });

任何人都可以在

reactjs

中建议如何执行此操作吗？

将始终在

数组中推送新值，而不会更新现有值

你需要这样写：

arrayvar = [];                     //create a variable, don't need to copy the state values here


arrayvar = [true, true, false];    // assign new array inside conditions

this.setState({
    visibility: arrayvar           //then update the state visibility array
})

您不需要创建
状态数组的副本
，因为您正在更新整个
数组
而不是
数组
的特定值，只需创建一个变量：

arrayvar = [];

完整代码：

var arrayvar = [];
if ( (user === "Rock" && computer === "Paper") || (user === "Paper" && computer === "Rock")) {
    arrayvar = [true, true, false];
} else if ((user === "Rock" && computer === "Scissors") || (user === "Scissors" || computer === "Rock")) {
    arrayvar = [true, false, true]
} else if ((user === "Paper" && computer === "Scissors") || (user === "Scissors" || computer === "Paper")) {
    arrayvar = [false, true, true];
} else if (user === "Rock" && computer === "Rock") {
    arrayvar = [true, false, false];
} else if (user === "Paper" && computer === "Paper") {
  arrayvar = [false, true, false];
} else if (user === "Scissors" && computer === "Scissors") {
  arrayvar = [false, false, true];
}
this.setState({ visibility: arrayvar });

将始终在
数组中推送新值，但不会更新现有值

你需要这样写：

arrayvar = [];                     //create a variable, don't need to copy the state values here


arrayvar = [true, true, false];    // assign new array inside conditions

this.setState({
    visibility: arrayvar           //then update the state visibility array
})

您不需要创建
状态数组的副本
，因为您正在更新整个
数组
而不是
数组
的特定值，只需创建一个变量：

arrayvar = [];

完整代码：

var arrayvar = [];
if ( (user === "Rock" && computer === "Paper") || (user === "Paper" && computer === "Rock")) {
    arrayvar = [true, true, false];
} else if ((user === "Rock" && computer === "Scissors") || (user === "Scissors" || computer === "Rock")) {
    arrayvar = [true, false, true]
} else if ((user === "Paper" && computer === "Scissors") || (user === "Scissors" || computer === "Paper")) {
    arrayvar = [false, true, true];
} else if (user === "Rock" && computer === "Rock") {
    arrayvar = [true, false, false];
} else if (user === "Paper" && computer === "Paper") {
  arrayvar = [false, true, false];
} else if (user === "Scissors" && computer === "Scissors") {
  arrayvar = [false, false, true];
}
this.setState({ visibility: arrayvar });

顺便说一下

var arrayvar = ["Rock", "Paper", "Scissors"]
    .map(
        k => computer === k || user === k
    );

如果你写的话，很可能会取代整个

var arrayvar = ["Rock", "Paper", "Scissors"]
    .map(
        k => computer === k || user === k
    );

如果你这样写的话，很可能会取代整体。
但这就是它的作用。@OliverCharlesworth我明白了。“你知道怎么更新它吗？但这就是我所知道的。”奥利弗·卡莱斯沃思说。你知道更新它的方法吗？如果我没有更新完整的可见性数组，那么我需要克隆吗，然后怎么做？在这种情况下，首先创建一个副本，使用项索引更新特定值，然后更新状态，如下所示：
let visibility=this.state.visibility.slice（）；可见性[项目索引]=值；this.setState（{visibility}）
非常感谢Mayank+1:）如果我没有更新完整的可见性数组，那么我需要克隆吗，然后怎么做？在这种情况下，首先创建一个副本，使用项索引更新特定值，然后更新状态，如下所示：
让visibility=this.state.visibility.slice（）；可见性[项目索引]=值；this.setState（{visibility}）
非常感谢Mayank+1:）它将如何工作？你能解释一下吗。看起来是最佳方法+1它将数组中的每个“键”映射到“是计算机还是用户选择的”。它将如何工作？你能解释一下吗。看起来是最佳方法+1它将数组中的每个“键”映射到“无论是计算机还是用户选择的”。