在 header in asp.net 核心中处理徽章的最佳做法是什么？

Question

所以我在我的 header 中实现了一个小徽章，指示用户在他的购物车中有多少商品..

这就是我的想法：在用户登录时设置徽章值，然后当用户 adds/removes 从他的购物车中时 increment/decrement 它。

我尝试在我的索引页上设置 jquery 中的值，如下所示：

function loadCartBadgeVal(id) {
$.getJSON(`/Cart/GetCartCount?customerId=${id}`,
    function (data) {
        $("#cart-badge").text('' + data);
    }); 
}

这有效，但是当我重定向到另一个页面时，我的徽章值重置为 0 ..我的徽章是在这样的局部视图中实现的：

<span class="badge badge-info" id="cart-badge"></span>

Answer 1

您可以使用 localStorage 保存购物车商品数量并将其显示在 site/app 上的任何位置。

以下代码段访问当前域的本地存储对象并使用 Storage.setItem() 向其添加数据项。

localStorage.setItem('cartCount', 1);

读取localStorage项的语法如下：

var count= localStorage.getItem("cartCount");

删除 localStorage 项的语法如下：

localStorage.removeItem("cartCount");