将 React 状态附加到另一个状态答案

【问题标题】：Appending React States to another State将 React 状态附加到另一个状态
【发布时间】：2016-07-25 19:03:10
【问题描述】：

在 React 中是否有适当的方法将状态附加到另一个状态？

例如。 All 的状态将具有 Cat、Dog 和 Fish 的状态

    this.state = { 
      Cat:true,
      Dog:true,
      Fish:true,
      All: Cat, Dog, Fish
   }

这是我目前拥有的：

var chosenAnimals = {};
  chosenAnimals["Cat"] = this.state.Cat;
  chosenAnimals["Dog"] = this.state.Dog;
  chosenAnimals["Fish"] = this.state.Fish;

有没有更好的方法来做到这一点？

【问题讨论】：

Cat 等是什么？如果你已经有一个数组，为什么还需要存储布尔标志？
@YuryTarabanko 是的，我需要存储密钥和值
为什么？您可以使用hasAnimal(animal) { return this.state.animals.includes(animal)} 来检查数组中是否有某些内容
@YuryTarabanko 我不确定我是否跟随。我不想检查它是否在数组中，我想将这些对象放在 this.state.All 中，无论它们是真还是假。我想将这些对象组合为一个名为 All 的对象，最终传递给动作创建者。
@lost9123193 如果是这种情况，那么我只需将个体动物存储在数组中，然后将它们从状态组合成数组以传递给动作创建器或将它们组合到动作创建器中。没有理由在 state 中存储两次数据。

标签： reactjs state

【解决方案1】：

要将状态中的元素推送到数组中，您需要做的就是：

var chosenAnimals = [];
chosenAnimals.push(this.state.Cat, this.state.Dog, this.state.Fish);

如果您查看 array.push 的作用 (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)，它会返回长度，因此在您提供的代码中， selectedAnimals 将包含 3 而不是您要查找的数组。但是只是简单地在数组上调用 push 而不是将它分配给任何东西（或它本身）就会将项目添加到数组中。

【讨论】：

这非常接近我正在寻找的解决方案。我唯一的问题是它给了我整数而不是键名，我能返回这样的东西吗？ selectedAnimals = [Dog:true, Cat:true] ... ?
如果您想为每个键命名，为什么要使用数组而不是对象？
@MichaelParker 你是对的！我在上面修复了我的代码，我想知道是否可以重构它