Question

我有一个问题，我真的不知道如何在数组中的对象上创建localStorage。我知道localStorage仅用于字符串，但是我正在创建一本新的对象。怎么做？我应该把那本书改成不使用构造函数，而只使用setter并在其上使用localStorage吗？

class Book {
    constructor(title, author, isbn) {
     this.title = title;
     this.author = author;
     this.isbn = isbn;
  }
}

class UI {
static displayBooks() {
    const storedBooks = [
        {
            title: 'Book one',
            author: 'John Doe',
            isbn: '343'
        },
        {
            title: 'Book two',
            author: 'Jane Doe',
            isbn: '455'
        }
    ];

    storedBooks.forEach((book) => UI.addBookToList(book));
}

static addBookToList(book) {
    const list = document.querySelector('#book-list');

    const row = document.createElement('tr');
    row.innerHTML = `
        <td>${book.title}</td>
        <td>${book.author}</td>
        <td>${book.isbn}</td>
        <td><a href="#" class="btn btn-danger btn-sm delete">X</a></td>
    `;

    list.appendChild(row);
}

static deleteBook(el) {
    if (el.classList.contains('delete')) {
        el.parentElement.parentElement.remove();
    }
}

static clearFields() {
    document.querySelector('#title').value = '';
    document.querySelector('#author').value = '';
    document.querySelector('#isbn').value = '';
}

static validateForm() {
    const title = document.querySelector('#title').value;
    const author = document.querySelector('#author').value;
    const isbn = document.querySelector('#isbn').value;

    if (title === '' || author === '' || isbn === '') {
        const div = document.createElement('div');
        div.className = 'alert alert-dismissible alert-danger';
        const message = document.createTextNode('Please fill all fields 
        before adding.');
        div.appendChild(message);

        const bookForm = document.querySelector('#book-form');
        bookForm.parentNode.insertBefore(div, bookForm);


        setTimeout(() => bookForm.parentNode.removeChild(div), 3000);

        return false;
    }

    return true;
   }
 }

document.addEventListener('DOMContentLoaded', UI.displayBooks);

// Add a new book
document.querySelector('#book-form').addEventListener('submit', (e) => {

e.preventDefault();

const title = document.querySelector('#title').value;
const author = document.querySelector('#author').value;
const isbn = document.querySelector('#isbn').value;

const book = new Book(title, author, isbn);

let isSuccess = UI.validateForm();

if (isSuccess) {
    UI.addBookToList(book);        
}

UI.clearFields();
});

document.querySelector('#book-list').addEventListener('click', (e) => {
console.log(e.target);
UI.deleteBook(e.target);
 });

Answer 1

您可以使用@echo off set shell = createobject("wscript.shell") : if shell.appactivate("CD_Restored") then shell.sendkeys "%{F4}"函数来帮助您。

下面的代码示例：

JSON.stringify()

如何在对象数组上使用localStorage

1 个答案: