How can i set my state by adding storage items

Question

I am doing a todo list project by using react and redux. I managed to send my todo's id and itself to the local storage. Now I am trying to load my storages to UI when I open the site by using componentDidMount life cycle method.

However, I can send just one of the storage items which is the last one in the storage array to my state. How can I handle this situation?

Here are my codes:

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]
        })
    })
}

Answer 1

After I did

this.setState({ storageHolder: elements })

it worked.