のlocalStorageが、私は私は私のToDoリストにデータを保存しようとしています

Question

var dataArray = []; 
localStorage.itemListRecord = JSON.stringify(dataArray); 
dataArray = JSON.parse(localStorage.itemListRecord); 

var dataObj = { 
    listItem: textInput, 
}; 
dataArray.push(dataObj); 

データを呼び出すように見えるカント、私はアイテムiが「文字列化」と「解析」という、オブジェクトにプッシュされます... しかし、

https://jsfiddle.net/headbangz/kn0bw6yw/

Answer 1

この例はうまくいくはずです。

var textInput = "example"; 
var dataObj = { 
    listItem: textInput, 
}; 
var dataArray = []; 

dataArray.push(dataObj);  
localStorage.setItem("itemListRecord", JSON.stringify(dataArray)); 

dataArray = JSON.parse(localStorage.getItem("itemListRecord"));  
dataArray.push(dataObj); 
localStorage.setItem("itemListRecord", JSON.stringify(dataArray)); 

Answer 2

私がいることを見ていない..私は..

私はその後、保存されたデータを呼び出す方法が非常に確認していないと、全くのlocalStorageになっていないアイテムのように思えますAPI

正確なハンドラが

// Add value from the input field 
document.getElementById("new-btn").addEventListener('click', function() { 
    var itemValue = document.getElementById("my-input").value; 
    if (itemValue) { 
     listTodoItem(itemValue); 
     localStorage.setItem('data', JSON.stringify(itemValue)); 
     console.log(localStorage.getItem('data')); 
    } 
}); 

を変更]をクリック - 私はMozillaのサイト https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

に上場されているものを使用して10

は、以下の解説パーログ

ためconsoleを確認してください。このexample tied to your click handler

にgetとset大丈夫であるように思われます

Answer 3

私は、スクリプトが起動するとすぐにlocalStorage.itemListRecordの場所あなたがそれから読むことを試みる前に、あなたが使っているものを探してください。だから、それは常に初期化時に空になり、このスクリプトは何を使用することはできませんがあります：また

// Data Object 
var dataArray = []; 
// CHANGED: I commented out the line below so that the localstorage is not cleared 
// localStorage.itemListRecord = JSON.stringify(dataArray); 
dataArray = JSON.parse(localStorage.itemListRecord); 

// CHANGED: added these lines only for debugging 
console.log('existing data'); 
console.log(dataArray); 

、私はまだそれは、ローカルストレージに追加されます任意のコードがないことに気づくとき、新しいToDoリストの項目が追加されます：それはであるものから初期順不同リストを作成していないためにも、これらの変更と、リストはまだ、ローカルストレージにあるものを反映していない、ということ

function listTodoItem(textInput) { 

    var dataObj = { 
     listItem: textInput, 
    }; 
    dataArray.push(dataObj); 

    // CHANGED: added this line to update localstorage whenever an items is added to the list 
    localStorage.itemListRecord = JSON.stringify(dataArray); 

     // CHANGED: added these lines only for debugging 
    console.log(dataArray); 
    console.log(dataObj); 

注意をdataArrayそれに多くのコードを追加する必要があります。

しかし、私がここで示唆したことと、jsfiddleを再実行するときのコンソールログの出力を見ると、localstorageの部分が動作していることがわかるはずです。 。