嵌套数组上的this.setState
嵌套数组上的this.setState
提问于 2018-09-20 01:16:13
编辑**
目前，我的React状态如下所示。
this.state = {
data: {
groups: [[]]
},
preview: [[]]
}组中的元素也是保存文件的数组。我有一个文件更改事件处理程序，目前看起来像这样。
handlePhotoChange(e, index) {
e.preventDefault()
let reader = new FileReader()
let file = e.target.files[0]
const { data, photoPreview } = this.state
const { groups } = data
reader.onloadend = () => {
this.setState({
data: {
...data,
groups: [...groups, [...[index], file]]
// tried: groups: [[...index], file]
},
preview: [...preview, [...[index], reader.result]]
// tried: preview: [[...index], reader.result]
})
}
reader.readAsDataURL(file)
}现在，这是添加另一个组，照片预览在第二个组中。当我尝试##代码##时，它只将reader.result附加到预览中，并且组保持为空。当我添加另一个文件时，它替换了预览中的reader.result
回答 2
Stack Overflow用户
发布于 2018-09-20 01:26:50
你可以尝试下面这样的方法
reader.onloadend = () => {
this.setState(prevState => ({
data: {
groups: [...prevState.groups, [file]]
// attempted - groups[index]: [...groups[index], [file]] - error
},
preview: [...prevState.preview, [reader.result]]
}));
}Stack Overflow用户
发布于 2018-09-20 01:31:34
使用像group: Array.isArray(group) ? group.concat([[file]]) : [[file]]这样Array#concat方法而不是group: [...group, [file]]
对preview做同样的事情
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52411120
复制相关文章
相似问题