我们如何将复选框推送到数组中，而复选框在 react js 中默认选中？答案

【问题标题】：how do we push a checkbox to an array while checkbox is by default checked in react js?我们如何将复选框推送到数组中，而复选框在 react js 中默认选中？
【发布时间】：2021-05-14 18:30:11
【问题描述】：

复选框默认选中如果默认选中此复选框，则应自动将其推入 addtess_type 数组。 https://react-jkrrcb.stackblitz.io演示

handleInputChangeDom = (event) => {
    const target = event.target;
    var value = target.value;
    const Address_type = this.state.Address_type;
    
    if (event.target.checked) {
      Address_type.push(event.target.value);
    } else {
      let index = Address_type.indexOf(event.target.value);
      Address_type.splice(index, 1);
    }

    this.setState({
      Address_type: Address_type,

    });
  };

【问题讨论】：

请添加更多代码sn-ps。很难检查你的哪个数组有默认检查。如果可能，请添加整个组件或制作工作演示，以便我们更好地查看。谢谢
我有 2 个复选框。其中之一是默认选中的。因此，如果默认选中复选框，则应自动将其推送到数组。
您提到该复选框默认选中并且您想将其推送到数组中，那么handleInputChangeDom 方法的用途是什么？这看起来像一个事件侦听器，它与您的要求有什么关系？
兄弟，这是我用来将复选框推送到 adress_type 数组的事件。但这对于未选中的复选框来说效果很好，但是如果默认情况下选中了该复选框，则这是行不通的。
@PriyankKachhela 请检查我是否添加了一些代码和一个实时项目。

标签： arrays reactjs checkbox

【解决方案1】：

我认为您正在尝试维护所有已检查项目的state。一个建议是使用Set 而不是数组。它会让您的生活变得更加轻松。


const handleInputChangeDom = (event) => {
    const newSet = new Set(this.state.Address_type); // create a clone, don't update current state
    if(event.target.checked) {
      newSet.add(event.target.value);
    } else {
      newSet.delete(event.target.value);
    }
    this.setState({ Address_type: newSet });
}

一个建议 - 请尝试使用 camelCase 和 React，这是建议的。

【讨论】：

这工作正常。但仍有一个主要问题未触及。还有另一个复选框被选中。这个复选框应该已经被推入数组。这是主要问题
对不起@lunatic，这更像是你如何初始化你的状态的问题。这部分应该由您的状态初始化来处理。当您初始化您的状态时，它应该已经是您的this.state.Address_type 的一部分。您尚未上传太多代码，因此无法发表更多评论，但如果您将已选择的条目添加到构造函数或初始化状态的任何位置，它肯定会很好。
先生，我已经提到了上面的链接，您应该检查一次默认选中 STREET 复选框的位置，而默认情况下不选中另一个。我的问题是，默认情况下选中 STREET 复选框时，我希望它的值应该已经呈现到数组中。希望你能解决我的问题，如果不让我知道，我会再次解释，因为我被困得很厉害。
jaiBhatt，你能帮帮我吗？
....................这是我的按钮，当我再次按下此按钮时，计数器应从 1 开始使用钩子做出反应。怎么样？