Javascript 如何通过添加存储项来设置状态
我正在使用react和redux执行一个todo列表项目。我设法将我的todo id和它本身发送到本地存储。现在,当我使用componentDidMount生命周期方法打开站点时,我尝试将存储加载到UI 但是,我只能将存储阵列中最后一个存储项中的一个发送到我的状态。我如何处理这种情况 这是我的密码:Javascript 如何通过添加存储项来设置状态,javascript,reactjs,Javascript,Reactjs,我正在使用react和redux执行一个todo列表项目。我设法将我的todo id和它本身发送到本地存储。现在,当我使用componentDidMount生命周期方法打开站点时,我尝试将存储加载到UI 但是,我只能将存储阵列中最后一个存储项中的一个发送到我的状态。我如何处理这种情况 这是我的密码: getElementsFromStorage = () => { let elements; if (localStorage.getItem('elements') ===
getElementsFromStorage = () => {
let elements;
if (localStorage.getItem('elements') === null) {
elements = [];
} else {
elements = JSON.parse(localStorage.getItem('elements'))
} return elements
}
componentDidMount() {
const elements = this.getElementsFromStorage();
elements.forEach(element => {
this.setState({
storageHolder: [...this.state.storageHolder, element]
})
})
}
在我做了之后
this.setState({ storageHolder: elements })
它成功了。初始的
this.state.storageHolder
将是一个空数组,对吗?那么为什么不简单:this.setState({storageHolder:elements})
?如果你想追加,你必须使用一个函数:this.setState(state=>({storageHolder:[…state.storageHolder,element]}))
()非常感谢兄弟。我不能这样想我不知道为什么xD。现在它成功了。再次感谢。欢迎:)您可以显示localStorage.getItem('elements')的控制台吗?(4)[{…},{…},{…},{…},{…},{…}]0:{id:“AuV-A5W5FY2SITWZGQCKI”,todo:“todo1”}1:{id:“vik8wkoXbp8PsIoP03QhI”,todo:“todo2:{id:“7RJFATRZNPKEY1BAI98”,todo:“todo3:{id:“GQUURIKSFEKSCYMX1”,todo:“todo4:PROTODO4:数组长度:}