How to render an array of Object which is stored in local storage

Question

I am working on a chat project where I want to push some data of objects to the array. I am storing my data in the local storage and when I enter the values in the input field, local storage got updated and I can check the array in console where objects also added in the array but when I try to render the values from local storage to the browser, it couldn't update on the page. Your help will be appreciated. Here is my code

function storingDataInLocalStorage() {
    let storedData = localStorage.getItem("tweetsData")
    if (storedData) {
        let storedTweets = JSON.parse(storedData)
        if (storedTweets) {
            storedTweets === tweetsData
        }
    }
}

function render() {
    document.getElementById('feed').innerHTML = getFeedHtml()
}

function saveDataToLocalStorage() {
    localStorage.setItem("tweetsData", JSON.stringify(tweetsData));
}

render()

Here is my data

export let tweetsData = [
{ handle: @TrollBot66756542 , profilePic: images/troll.jpg, likes: 27, retweets: 10, tweetText: Buy Bitcoin, ETH Make low low prices. Guaranteed return on investment. HMU DMs open!!, replies: [], isLiked: false, isRetweeted: false, uuid: '4b161eee-c0f5-4545-9c4b-8562944223ee', },
{ handle: @Elon ✅, profilePic: images/musk.png, likes: 6500, retweets: 234, tweetText: I need volunteers for a one-way mission to Mars . No experience necessary, replies: [ { handle: @TomCruise ✅, profilePic: images/tcruise.png, tweetText: Yes! Sign me up! , }, { handle: @ChuckNorris ✅, profilePic: images/chucknorris.jpeg, tweetText: I went last year, }, ], isLiked: false, isRetweeted: false, uuid: '3c23454ee-c0f5-9g9g-9c4b-77835tgs2', }, { handle: @NoobCoder12, profilePic: images/flower.png, likes: 10, retweets: 3, tweetText: Are you a coder if you only know HTML?, replies: [ { handle: @StackOverflower ☣️, profilePic: images/overflow.png, tweetText: No. Onviosuly not. Go get a job in McDonald's., }, { handle: @YummyCoder64, profilePic: images/love.png, tweetText: You are wonderful just as you are! ❤️, }, ], isLiked: false, isRetweeted: false, uuid: '8hy671sff-c0f5-4545-9c4b-1237gyys45', },
]

enter image description here

When the user add some data into the textarea it should be rendered up onto the page and it still exist after the page refresh.

Answer 1

As far as I know, you should have written the render update function, did you manually call the render update function after modifying the data?