javascript - 如何将本地存储添加到我的项目中？

Question

这是我项目的最后一部分。本地存储。

我想添加我的项目本地存储属性，但我不明白 youtube 上的补充资源。

我需要在刷新页面时始终显示我的“用户地址详细信息”。这是我的项目。

如果你想获得所有代码，你可以去 jsfiddle

谢谢大家

var addressList = [];

var generateGUID = () => {
    var s4 = () => {
        return Math.floor((1 + Math.random()) * 0x10000)
            .toString(16)
            .substring(1);
    }
    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
}


var generateColumn = user => `
<div class="one" id="three">
    <h5>Adres Name</h5>
    <div>${user.name} </div>
    <button data-user="${user.id}" class="del">Del</button>
    <button data-user="${user.id}" class="edit">Edit</button>
</div>
    <h5>Addres</h5>
    <div>${user.addres} </div>
    `;

var generateRow = user => `
<div class="box" data-info='${JSON.stringify(user)}' id="${user.id}">
        <div class="one">
        <h5>Adres Name</h5>
        <div>${user.name} </div>
        <button data-user="${user.id}" class="del">Del</button>
        <button data-user="${user.id}" class="edit">Edit</button>
        </div>
        <div class="two">
        <h5>Addres</h5>
        <div>${user.addres} </div>
        </div>
    </div> 
</div>
`;


$('#button').click(function () {

    // Kullanıcıyı oluştur.

    let user = {
        name: $('#adressName').val(),
        addres: $('#adress').val(),
        id: generateGUID()
    };

    addressList.push(user);
    $('#adressName').val('');
    $('#adress').val('');
    let row = $(generateRow(user));


    $(row).find(".del").click(function () {
        if (window.confirm("Do you really want to delete?")) {
            $(row).remove();
        }
    });

    $(row).find(".edit").click(function () {
        $("#button").hide();
        $("#edit").show();
        $('#adressName').val(user.name);
        $('#adress').val(user.addres);
        $('#userId').val(user.id);

    });

    $('.asdf').append(row);

});

$('#edit').click(function () {
    let user = {
        name: $('#adressName').val(),
        addres: $('#adress').val(),
        id: $('#userId').val()
    };


    addressList.push(user);
    $('#adressName').val('');
    $('#adress').val('');
    let row = $(generateColumn(user));


    $('#' + user.id).html(generateColumn(user));
    $("#edit").hide();
    $("#button").show();

    $(".edit").click(function () {
        $("#button").show();
        $("#edit").hide();
        $('#adressName').val(user.name);
        $('#adress').val(user.addres);
        $('#userId').val(user.id);


    });


    $('#' + user.id).find(".del").click(function () {
        if (window.confirm("Do you really want to delete?")) {
            $('#' + user.id).remove();
        }
    });


});

Answer 1

您无需添加localStorage - 它始终存在。

要存储您的数据，请使用:

localStorage.setItem('myKey', 'value');

检索数据:

var myVariable = localStorage.getItem('myKey');

<小时/>

就您而言:

localStorage.setItem('userAddress', user.addres);