сохранить taginputs в массиве и отображать при повторном открытии - PullRequest
Новая
       1

сохранить taginputs в массиве и отображать при повторном открытии

0 голосов
/ 10 декабря 2018

У меня есть всплывающее окно с расширением chrome, где пользователи могут вводить подредакты, которым они хотят следовать.https://imgur.com/a/vjw2rMm

теги будут сохранены в виде массива.Однако после закрытия и повторного открытия всплывающего массива он снова становится пустым.

Как сохранить его так, чтобы при его открытии поле заполнялось сохраненным массивом?

Что я пробовал: Я пробовал "localstorage", ноэто не работает, и это портит "reddit.push"

Uncaught TypeError: reddits.push не является функцией

без функции saveList, массив можетбудет толкаться и сращиваться хорошо.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Simple Chrome Extension</title>
  <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap-tagsinput.css">
</head>
<body>
  <div class="inputContainer">
    <input type="text" id="Tags" class="form-control"/>
  </div>
  <script src="jquery-3.3.1.min.js"></script>
    <script src="bootstrap-tagsinput.js"></script>
  <script type="text/javascript" src="js/popup.js"></script>
</body>
</html>

javascript 

$('#Tags').tagsinput({
  confirmKeys: [13, 32, 44]
});

$('input').on('itemAdded', function(event) {
  reddits.push(event.item);
  console.log(reddits);
  saveList();
});

$('input').on('itemRemoved', function(event) {
  reddits.splice(reddits.indexOf(event.item), 1);
  console.log(reddits);
  saveList();
});

function saveList() {
  localStorage.setItem('redditList', reddits);
  reddits = localStorage.getItem('redditList');
}

var reddits = [];

1 Ответ

0 голосов
/ 10 декабря 2018

Вам необходимо объявить переменные перед их использованием.

Кроме того, localStorage хранит только строковые значения.Преобразуйте ваши массивы и объекты в строку, используя JSON.stringify(), затем преобразуйте их обратно, используя JSON.parse(). 

var reddits = [];   // declare before using
var exists = localStorage.getItem('redditList');
if(exists) {
    reddits = JSON.parse( exists );
}

$('#Tags').tagsinput({
  confirmKeys: [13, 32, 44]
});

$('input').on('itemAdded', function(event) {
  reddits.push(event.item);
  console.log(reddits);
  saveList();
});

$('input').on('itemRemoved', function(event) {
  reddits.splice(reddits.indexOf(event.item), 1);
  console.log(reddits);
  saveList();
});

function saveList() {
  localStorage.setItem('redditList', JSON.stringify(reddits));   // store it as string
  reddits = JSON.parse( localStorage.getItem('redditList'));     //  convert it to object
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...