我有一个将数据保存到浏览器本地存储的费用表格。我在表格下方的页面上有一个按钮，因此在您填写表格后，您可以单击以打印出格式良好的数据。
由于我的应用程序的功能，我必须在本地存储中使用 JSON 数据。
我正在使用 js 变量从本地存储中获取数据：
var my_expenses = localStorage.getItem('my_expenses');
这是我的浏览器本地存储中的条目，具有未缩小的值。
键：my_expenses 值：
{
"income": {
"1": {
"name": "Pay (after tax)",
"freq": "26",
"value": "233"
},
"2": {
"name": "Partners take home pay",
"freq": "4",
"value": "10"
},
"3": {
"name": "Bonuses/overtime",
"freq": "26",
"value": "30"
},
"4": {
"name": "Income from savings and investments",
"freq": "1",
"value": "50"
},
"5": {
"name": "Child support received ",
"freq": "12",
"value": "40"
}
},
"outgoings": {
"1": {
"name": "Electricity",
"freq": "4",
"value": "0"
},
"2": {
"name": "Gas",
"freq": "4",
"value": "0"
},
"3": {
"name": "Water",
"freq": "4",
"value": "0"
},
"4": {
"name": "Internet",
"freq": "4",
"value": "0"
},
"5": {
"name": "Telephone",
"freq": "4",
"value": "0"
},
"6": {
"name": "Car Insurance",
"freq": "1",
"value": "0"
}
}
}
根据 Print.js，您可以像这样打印 JSON 数据（包括我的变量和我的本地存储数据）：
<button type="button" onclick="printJS({printable: my_expenses, properties: ['name', 'freq', 'value'], type: 'json'})">
Print JSON Data
出于某种原因，我的控制台出现错误，我无法弄清楚，也没有打开打印对话框。
Uncaught Error: Missing printable information.
at init (print.min.js:1)
at HTMLButtonElement.onclick ((index):156)
我认为这可能是我的 JSON 在本地存储中的结构？任何帮助将不胜感激。
尝试使用 JSON.parse() 像这样：
var my_expenses = JSON.parse(localStorage.getItem("my_expenses"));
在我添加 JSON 解析之前。我得到了错误，这是控制台中本地存储的输出。
添加后，这是输出，打印按钮似乎可以工作：
但是打印对话没有数据？
对象的创建方式和本地存储功能：
//Set the default incomes and outgoings here
var defaultsObj = {
'income':{
1:{name:"Pay (after tax)",freq:52,value:0},
2:{name:"Partners take home pay",freq:4,value:0},
3:{name:"Bonuses/overtime",freq:26,value:0},
4:{name:"Income from savings and investments",freq:1,value:0},
5:{name:"Child support received ",freq:12,value:0}
},'outgoings':{
1:{name:"Electricity",freq:4,value:0},
2:{name:"Gas",freq:4,value:0},
3:{name:"Water",freq:4,value:0},
4:{name:"Internet",freq:4,value:0},
5:{name:"Telephone",freq:4,value:0},
6:{name:"Car Insurance",freq:1,value:0}
}
};
//Functions to store and retrieve objects from localstorage
function ls_store(name,o){
localStorage.setItem(name, JSON.stringify(o));
};
function ls_read(name){
return JSON.parse(localStorage.getItem(name));
};
function set_defaults(){
ls_store('my_expenses',defaultsObj);
expensesObj = ls_read('my_expenses');
}
//If our localstroage items are empty let's store the defaults
if(ls_read('my_expenses')==null){
set_defaults();
}