Question

在/app.js

中

我初始化一个像下面的购物袋

if (Meteor.isClient) {
  Meteor.startup(function () {
    var bag = Session.get("shoppingBag") || {};
    console.log(bag)
    Session.set("shoppingBag", bag);
  });
}

我将其添加到另一页的购物袋

  Template.ProductDetail.events({
    'click button.add-to-bag': function (event, template) {
      var productId = template.data._id;
      var bag = Session.get("shoppingBag");
      if (!(productId in bag)) {
        bag[productId] = true;
      }
      Session.set("shoppingBag", bag);
      $('.msg').fadeIn().fadeOut();
    },
  });

但是，我发现每次刷新页面时都会重新运行启动代码。据我所知，刷新后仍应保留会话，var bag = Session.get("shoppingBag") || {};不应返回空对象。我究竟做错了什么？谁能解释一下这里发生了什么？

Answer 1

名称Session是一个非常糟糕的名称，它不会按预期的方式工作。如果您需要此类行为，可以使用此程序包：https://github.com/okgrow/meteor-persistent-session

请注意，此程序包将保存所有内容，因此请不要忘记在模板created回调时初始化会话的KeyValues。

我建议您在每个模板上使用ReactiveDict，并在子模板上使用它。为此，Meteor将在下一个版本中提供vars。如果你将Session用于所有事情，你会发现它很容易发生碰撞。

Answer 2

像马里奥建议的那样，我不得不使用localStoarge，因为Session和本地收集在Meteor中都不是永久性的。但是，我还需要Session的反应性质，我必须做以下事情。

if (Meteor.isClient) {
  Meteor.startup(function () {
    try {
      var bag = JSON.parse(localStorage.getItem("shoppingBag"));
    } catch (e) {
      var bag = {};
    }
    bag = bag || {};
    Session.set("shoppingBag", bag);
  });
}

每次刷新后，我们都会看localStorage。存储时

  var bag = Session.get("shoppingBag");
  Session.set("shoppingBag", bag);
  localStorage.setItem("shoppingBag", JSON.stringify(bag)); //localStoarge only take string key:value pairs

确保存储在localStorage以及Session中。最后，

  Template.Bag.helpers({
    bagged_products: function () {
      var bag = Session.get("shoppingBag") || {};
      ...
    }
  })

这确保每次更新Session时，都会再次调用此帮助程序。

初始化购物袋

2 个答案: