Question

我不知道怎么说这个，但基本上我实现了一个日期选择器，因此用户可以选择显示数据的范围。用户选择开始数据和结束日期，然后重新运行位于lib文件夹中的巨大函数，以重新运行并更改主页上通过Meteor帮助程序显示的所有数据

用户选择的日期存储在会话变量中，这些变量可以在我想要的功能中访问。该函数运行，但客户端上没有显示任何更改（但是在控制台中这些更改都是正确的，我可以通过函数中的console.log语句看到更改。）

这就是日期选择器onRendered函数的样子：

Template.dashboard.onRendered(function(){
  // Date picker
  $(function() {

    function cb(start, end) {
        $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));

      var startDate = start.format('MMMM D, YYYY');
      Session.set("startingDate", startDate)
      var endDate = end.format('MMMM D, YYYY');
      Session.set("endingDate", endDate);
    }

  var firstDate = dates[0];
  var lastItem = dates.length-1;
  var lastDate = dates[lastItem]
    cb(moment(firstDate), moment(lastDate));

    $('#reportrange').daterangepicker({
        ranges: {
           'Last 7 Days': [moment().subtract(6, 'days'), moment()],
           'Last 30 Days': [moment().subtract(29, 'days'), moment()],
           'This Month': [moment().startOf('month'), moment().endOf('month')]
        }
    }, cb);

});

  });

The Tracker.autorun：

  Tracker.autorun(function(){
    libFxn();
  });

libFxn()是我在Tracker中调用的lib文件夹中相当大的函数。因此，只要其中一个Session变量由于用户输入而发生变化，就会运行Tracker.autorun触发和函数，并且正在更改值，我可以通过控制台查看。但是，在客户端，我看不到变化。

这让我处于两难境地：我需要根据输入向用户显示结果数据的变化，但是：

1）即使正在执行lib文件夹中的函数，也不会在客户端中看到更改。 2）我无法以任何方式使用document.location.reload(true);或刷新页面，因为当页面刷新时，会话变量将恢复为默认值（dates的第一个日期和最后日期我手边的数组。）

因此，我需要找出一种方法将用户的日期输入数据发送到lib文件夹中的函数，以便显示客户端/模板中不涉及Sessions的更改如果页面必须刷新。

如果有人能给我提示或提示，我将不胜感激。

这是一个帮助器的示例，它基本上与所有其他辅助器相同，减去它调用的不同变量（所有这些变量都在libFxn()函数中，并在那里填充并通过这些辅助函数调用）：< / p>

  WinRate: function(){
    if(Number((((wins/gamesPlayed))))){
      return numeral((wins/gamesPlayed)).format('0%');
    } else if(Number((((wins/gamesPlayed)))) === 0){
      return "0%"
    } else{
      return "n/a";
    }
  }

Answer 1

从上面的评论来看，你并没有让变量本身具有反应性。您可以使用Tracker.Dependency执行此操作。

在您的lib文件中，您将需要使用globalsDep = new Tracker.Dependency;或类似的，您可能希望为您的函数的每种类型的结果都有一个，即如果您可以独立修改10个变量，那么您将需要10，a每个新依赖项，否则每次任何值更改时，您将重新运行依赖于它们的每个帮助程序。如果你想要重新运行一切当然只需使用一个：

globalsDep = new Tracker.Dependency;

您修改相关变量的每个地方（或者如果您只需要一个依赖项，则在函数的末尾）您需要告诉依赖项它已变为无效且需要重新计算

globalsDep.changed();

然后在你要重新运行的每个助手中调用depends函数：

globalsDep.depends()

你应该看到它们在视野中直接运行。以下简单示例：

/****************
** In Lib File **
****************/
globalsDep = new Tracker.Dependency;
xDep = new Tracker.Dependency;

x = 15;
y = 10;
t = 0;

myBigLongFunction = function(){
  x = x + 5;
  y = y + 1;
  t = x + y;

  console.log('Changing Values', x, y, t);
  globalsDep.changed();

  if (x > 20)
    xDep.changed();
}

/****************
** In JS File **
****************/
Template.main.helpers({
    testGlobalReactive: function(){
      globalsDep.depend();
      console.log('All vars rerun');
      return {t:t, x:x, y:y};
    },
    testXReactive: function(){
      xDep.depend();
      console.log('X rerun');
      return x;
    }
});

/****************
** In HTML File **
****************/
<template name="main">
  <div style="min-height:200px;width:100%;background-color:lightgrey;">
    {{#with testGlobalReactive}}
      X:{{x}}<br><br>
      Y:{{y}}<br><br>
      T:{{t}}<br><br>
    {{/with}}
    X Individual: {{testXReactive}}
  </div>
</template>

虽然我会警告不要以这种方式拥有客户端状态，但是你可以更好地利用集合的反应性并确保所有内容都通过它们与服务器同步，将这些存储在客户端上的数据保存在任何地方都不会持久化不能以任何方式信任，因为客户端可以随意修改全局变量。如果您已经在函数中的集合中设置此数据，则忽略最后一个但您可能仍然需要考虑在铁路由器数据字段或模板级别直接从集合访问数据，因为它将默认为被动，而无需Tracker.dependency：D

当Meteor（datepicker）中的用户输入发生变化时，显示数据的最佳方式是什么？

1 个答案: