sessionStorage returns 未定义

Question

我的客户端应用程序使用 sessionStorage 将数据从一个视图移动到另一个视图。我的代码是：

$("#reportGrid").find("input:checked").each(function () {
    rows.push($(this).closest('tr'));

    var dataItem = grid.dataItem($(this).closest('tr'));
    console.log("TicketNumber => " + dataItem.ticketNumber + " " + dataItem.lineNumber);

    // store dataItem in session Storage;
    sessionStorage.setItem('selectedRecords', JSON.stringify(dataItem));
    var retrievedObject = JSON.parse(sessionStorage.getItem('selectedRecords'));

    console.log("Begin -----------");
    console.log("userSelectedRecords => " + retrievedObject[0].ticketNumber);
    console.log("End -----------");
})

然而，行 console.log("userSelectedRecords => " + retrievedObject[0].ticketNumber); returns

Uncaught TypeError: Cannot read property 'ticketNumber' of undefined

如何显示之前视图中的数据？

Answer 1

阅读您的代码时，您想要遍历项目数组并获取所有选中的项目。当前，您正在遍历选中的项目并将每个项目存储到会话变量中，然后继续对其进行写入。当你阅读它时，你将永远只有一个项目。如果那是你想要的，那么你只需要引用对象，而不是数组语法。

console.log("userSelectedRecords => " + retrievedObject.ticketNumber);

但我认为这不是您想要做的。我想你想要一组用户选择的元素。要拥有一个数组，您需要构建列表，然后在循环完成时保存整个数组。

//temp holding place for the data
var records = [];    
$("#reportGrid").find("input:checked").each(function () {
    var dataItem = grid.dataItem($(this).closest('tr'));
    records.push(dataItem);  //push the element
});
//save it to localstorage
sessionStorage.setItem('selectedRecords', JSON.stringify(records));

//now your syntax would work
var retrievedObject = JSON.parse(sessionStorage.getItem('selectedRecords'));
if (retrievedObject.length) { //make sure we have at least one item
    console.log("userSelectedRecords => " + retrievedObject[0].ticketNumber);
}

sessionStorage returns 未定义

sessionStorage returns undefined

jquery

session-storage

typescript

kendo-grid