我刚开始使用react。为了存储数据,我使用了一个对象数组。我特意创建了一定长度(100),以便使用id安全地添加用户响应(id乱序,可以先回答1,再回答3)。我写了一个函数,将一行添加到0数组元素(数组不能被删除,它被使用),但是由于某种原因,元素的值在整个数组中是重复的。为什么会发生这种情况,如何解决?
<变量/strong>
const [ans,setAns] =useState(Array(100).fill({
Answer:[''],
}))
函数strong>
function SetWordAnswer(answer) {
let next = [...ans];
next[0].Answer[0] =answer
setAns(next)
console.log(next)
}
html中的元素
{VariableData.type === 'WordAnswer' ?
<input placeholder="ответ" type="text" value={ans[variableId-1].Answer[0]} className="my-4 p-2 text-gray-50 bg-gray-900 rounded-full" onChange={(event)=>{SetWordAnswer(event.target.value)}}/>: ''}
<使用数据/strong>链接
函数后的新数据链接
您可以用一个虚拟值填充数组,然后使用.map()
用不同的对象填充它您想要的形式:
const [ans,setAns] = useState(Array(100).fill(null).map(() => ({
Answer:['']
})));
所有元素最初看起来都相似,但它们将是不同的对象。