如何让 localStorage 数据持久化

Question

I'm kind of racking my brain over how to get data to persist in localStorage while also adding new data. The jist of what I'm doing is creating a quiz that will store the users initials and their score into localStorage so that when refreshed and the user chooses to retrieve the high scores they'll be displayed. I'm having trouble where it gets to the end of my app and the data that's already there is completely overwritten. Any help is appreciated.

function saveScore() {
    var data = [{name: userInitialsEl.value}, {score: scoreCount}];
    localStorage.setItem("high-score", JSON.stringify(data));
}

userInitialsEl is a text input. scoreCount is the score that's incremented as the user answers questions correctly.

Answer 1

You need to get the current data first then push in the new one before saving it back, you can do something like this:

function saveScore() {
  let newData = !!localStorage.getItem("high-score") ? JSON.parse(localStorage.getItem("high-score")) : []
  newData.push([{name: userInitialsEl.value}, {score: scoreCount}])
  localStorage.setItem("high-score", JSON.stringify(newData));
    
}