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’,
},
]
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.
2
Answers
could shed more light on this
storingDataInLocalStorage()
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?