Local Storage resetting the value after page refresh

Question

I want to input data from user input and store to local storage, but when the page get refresh the value of local storage reset. How to store all user input in local storage even I hit refresh?

JavaScript.

var myArr = [];
function botResponse(rawText) {
  var inputText = rawText;   //user input     
  myArr.push(inputText);
  var arrString = myArr.join(", ");

  var existing = localStorage.getItem('UserInput');
  existing = [];
  existing.push(arrString);
  localStorage.setItem('UserInput',existing);
 
 
  // var arrStringTwo = existing.join(", ");
  

  // Bot Response
  var new_value = window.localStorage.getItem("UserInput");  
  ----------
  }

Answer 1

You're resetting it with existing = [];.

You can't store arrays directly in localStorage , it can only store strings. You need to convert to and from JSON.

  var existing = localStorage.getItem('UserInput');
  if (existing) {
    existing = JSON.parse(existing);
  } else {
    existing = [];
  existing.push(arrString);
  localStorage.setItem('UserInput',JSON.stringify(existing));