如何更改此代码,以便每次刷新浏览器时都不会删除

时间:2020-05-10 10:37:44

标签: javascript arrays json

因此,我正在做一个提醒应用程序,该应用程序需要将每个任务都存储在我正在使用的本地存储中,除了每次刷新浏览器时,它都会删除本地存储中的所有内容。我需要添加/更改以存储项目而不丢失每次刷新的内容

 let reminders = [];

 const addReminders = (ev) => {
     ev.preventDefault(); 
let reminder = {
    ReminderInput: document.getElementById('ReminderInput').value,
    DateInput: document.getElementById('DateInput').value,
    InfoInput: document.getElementById('InfoInput').value

}

const arr = [reminder.ReminderInput, reminder.DateInput, reminder.InfoInput]

localStorage.setItem('todoForm', JSON.stringify(arr))
reminders.push([reminder.ReminderInput, reminder.DateInput, reminder.InfoInput]);
localStorage.setItem("reminders", JSON.stringify(reminders));
}

 document.addEventListener('DOMContentLoaded', () => {
     document.getElementById('btn').addEventListener('click', addReminders);
 });

<form id="todoForm">
                <label for="ReminderInput">Reminder</label>
                <input class="u-full-width" type="text" id="ReminderInput">


                <label for="DateInput">Date</label>
                <input class="u-full-width" type="datetime-local" id="DateInput">


                <label for="InfoInput">Additional Information</label>
                <textarea class="u-full-width" type="text" placeholder="Remember to..." id="InfoInput"></textarea>
                <button type="button" id="btn" class="button-primary">Add Reminder</button>
            </form>

1 个答案:

答案 0 :(得分:0)

在第一行中,您将提醒设置为空数组。

        <munit:validation >
          <munit-tools:assert doc:name="Assert payload" doc:id="9df23ba1-befd-4da9-b8aa-a95b5b59efff" message="The payload does not match">
            <munit-tools:that ><![CDATA[#[%dw 2.0
           import sample_data::address
          // how to import  multiple folder path sample_data/response::address???

            ---
            address::main({payload: payload})]]]></munit-tools:that>
         </munit-tools:assert>
       </munit:validation>

,在本节中,您将其设置到本地存储中

let reminders = [];

由于每次重新加载时提醒都设置为空数组,因此您的数据将在重新加载后删除。

您需要从本地存储中获取数据,否则将其设置为空。

使用此

reminders.push([reminder.ReminderInput, reminder.DateInput, reminder.InfoInput]);
localStorage.setItem("reminders", JSON.stringify(reminders));
相关问题