Javascript 如何使用复选框将数据写入数组？

我有这个密码

const [selectedStudents, setSelectedStudents] = useState([])
const studentsChangeHandler = (e) => {
  setSelectedStudents({...selectedStudents,[e.target.id]:e.target.value});
  console.log('selectedStudents is ',selectedStudents)
};

和在网站上

<input
  type="checkbox"
  id={index}
  value={student._id}
  onChange={studentsChangeHandler}
/>

当我在网站上选中第一个复选框时，没有任何内容被写入，但是第二个被写入，为什么

---

您可以使用jquery来完成。本例通过选择器选择复选框，然后对每个元素调用.each（）方法，最后将它们推入数组

JQuery |获取数组中所有选中的复选框。
#GFG_UP{
字号：17px；
字体大小：粗体；
}
#GFG_下降{
颜色：绿色；
字体大小：24px；
字体大小：粗体；
}
钮扣{
边缘顶部：20px；
}
笨蛋


GFG：
极客：
笨蛋：
门户：


点击这里


$（'GFG#u UP'）
.text（'首先选中几个元素，然后单击按钮'）；
$（'button'）。在（'click'，function（）上{
var数组=[]；
$（“输入：复选框[名称=类型]：选中”）。每个（函数（）{
array.push（$（this.val（））；
});
$（'GFG#u DOWN'）。文本（数组）；
});

通常，React中的

设置状态或使用状态

是异步的。因此，更新状态后，我们将无法在中捕获更新的状态

在挂钩中，更新的状态将仅在下一次渲染中可用。因此，为了查看状态是否得到更新，我们可以使用

useffect

hook。下面是同样的例子

const{useState，useffect}=React；
常量应用=（）=>{
const[students，setStudents]=useState（[]）；
const onChangeHandler=事件=>{
const{target:{id，value}}=event；
设置学生人数（学生人数=>{
//推送id为键和值的新对象
//将复选框的值设置为数组中的值。
//在您的情况下，该值将是学生id。
//但为了简单起见，这里我使用了1，2作为ID和值
返回[…prevStudents，{[id]：value}]
});
}
//打印初始状态以及状态更新时（即学生更新
useffect（（）=>{
console.log（学生）；
}[学生]）
返回(
输入1
输入2
)
}
ReactDOM.render（，document.getElementById（“react”）；

因为

setSelectedStudents

是不同步的。因此，可以在下一次渲染时看到状态的变化。这就是为什么在

控制台.log

中可以看到上一个状态。@Nithish所以一切都可以正常工作？因此，我以这种方式获取对象，是否可以使其成为纯数组？@Nithish，一切都应该正常。可以使用

useffect

查看更改。将其存储为对象的原因是您正在将对象传递给

studentsChangeHandler

中的

setSelectedStudents

。相反，您应该添加新id。这是我可以说的编码错误。这会起作用，但在React中避免它不是更好吗？