在刷新时无法将动态添加的表行保留在HTML中时,应用程序成功地将信息存储在开发工具中的本地存储中,但没有保留在HTML中。
我已经尝试了许多无济于事的方法,包括使用电子IPC,以及通过其他电子模块将它们存储在appData中,但没有一个起作用。
HTML表格
<table class="ui-selectable" cellspacing="0px" id='tasksTable'>
<thead>
<tr id="taskHeading">
<th id="taskID">#</th>
<th id="taskSite">SITE</th>
<th id="taskprofile">PRODUCT</th>
<th id="taskSize">SIZE</th>
<th id="taskProxy">PROFILE</th>
<th id="taskStatus">STATUS</th>
<th colspan="3" id="taskAction">ACTION</th>
</tr>
</thead>
JS
let taskInfo = {
id: '',
keywords: '',
size: '',
color: '',
category: '',
profile: ''
}
const tasksJSON = localStorage.getItem('tasks', taskInfo)
if (tasksJSON !== null) {
tasks = JSON.parse(tasksJSON)
}
//var tasksJSON = JSON.parse(localStorage.getItem('taskInfo'));
function createTaskID() {
let text = "";
let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZ01234567890123456789";
for (var i = 0; i < 3; i++){
text += possible.charAt(Math.floor(Math.random() * possible.length));
}
taskID = text
return text;
}
document.querySelector('#add-button').addEventListener('click', function(e){
let taskID = createTaskID()
let keywordTask = document.querySelector('#keyword-input').value.toLowerCase().split('&')
let sizeTask = document.querySelector('#size-input').value
let colorTask = document.querySelector('#color-input').value.toLowerCase()
let categoryTask = document.querySelector('#category-select').value
let profileTask = document.querySelector('#profile-select').value
taskInfo.id = taskID;
taskInfo.keywords = keywordTask;
taskInfo.size = sizeTask;
taskInfo.color = colorTask;
taskInfo.category = categoryTask;
taskInfo.profile = profileTask;
let x=document.getElementById('tasksTable').insertRow(1);
x.id="newTask";
x.setAttribute("style","background-color: #10121A;")
let c0=x.insertCell(0);
c0.id = "taskID"
let c1=x.insertCell(1);
let c2=x.insertCell(2);
let c3=x.insertCell(3);
let c4=x.insertCell(4);
let c5=x.insertCell(5);
c5.id="status"
let c6=x.insertCell(6);
c0.innerHTML= taskID;
c1.innerHTML= 'Supreme';
c2.innerHTML= keywordTask;
c3.innerHTML= sizeTask;
c4.innerHTML= 'personal';
c5.innerHTML= 'Idle.';
c6.innerHTML= '<td width="3%"><span style="color: white;"><i class="material-icons">play_arrow</i></span></td>';
ipcRenderer.send('createWorker', taskInfo)
localStorage.setItem('tasks', JSON.stringify(taskInfo))
})