页面刷新后未存储本地存储

Question

为了将值保存在本地存储中，我很难理解我在代码中做错了什么。

我有一个相当大的代码项目，所以我将尝试总结该程序的总体目标。 我正在从新闻 API 中提取新闻文章并显示这些文章； 每篇文章（取决于它来自的出版物）将不同的数值推送到数组allSource2 。 然后我将这个数组的总和得出一个“分数”（变量称为sum ）

我基本上希望该分数存储在本地，以便即使在页面刷新后也可用。 我认为可能会发生错误，因为我将localStorage函数放在哪里。 目前我把它放在 click 事件下，它也会推送数组中的数值（当你点击文章标题时）。 我超混淆它可能是别的地方，使其真正更新的sum即总和的每一次变化。

此外，它确实可以存储它（我在控制台上检查了localStorage ，刷新后它仍然有效，但刷新并单击另一篇文章后，它会重置为本文的任何值）

我没有把整个代码，因为它太长了。 其他一切正常，仅此而已。 此外，所有这些都包含在一个大功能中

我定义let sum =0; 在代码的开头。 然后，这就是点击事件。

document.getElementsByClassName('article-rating')[i]
  .addEventListener('click', function(event) {

    sum = allSource2.reduce((tempSum, val) => tempSum + val);
    console.log("article score is now" + " " + sum);
    var lastname = localStorage.getItem("overallsum");
    localStorage.setItem("overallsum", sum);


 });

我也试着把var lastname = localStorage.getItem("overallsum"); 在代码的开头，当第一个函数但没有运气。

非常感谢你的帮助！ 并对任何格式问题表示歉意，我对此非常陌生。

Answer 1

每次单击事件时， overallsum都会设置，这就是问题所在。 如果overallsum是一次性存储到本地存储，那么您可以检查overallsum的值是否为null ，如果是，则第一次存储该值。

例子：

 if (localStorage.getItem("overallsum") === null) { localStorage.setItem("overallsum", sum); }

否则，如果overallsum是什么，那么对于每个单独的文章，您可以使用 2D 数组，然后使用相同的条件检查设置值。