Question

此问题遵循我之前的问题：Meteor: How to publish custom JSON data

我创建了一个构建复杂JSON的Meteor方法（使用不同的集合等构建）。有了这些数据，我需要使用D3.js构建一个图表。

我曾经在Session中设置数据，但是当我意识到每次到达页面时都需要刷新它，它无法正常工作。

显然，我在机制中有些不明白的东西，但这是我的代码：

Template.myPage.rendered = function(){

    var data = Meteor.call('myData');

    var svgContainer = d3.select("#svg");

    var margin = 40;
    var width = parseInt(d3.select("#svg").style('width'),10);
    var height = parseInt(d3.select("#svg").style('height'),10);
    // ... some more D3 code where I need the data

我得到的错误是：

"Exception from Tracker afterFlush function: data is undefined

我已经尝试在模板外调用Meteor方法并将结果放入Session（在回调函数中），但它不起作用。我也试过使用反应性变量，但我无法做到。

非常感谢。

Answer 1

嗯，当您尝试使用没有值的变量时，会出现"undefined"错误。

console.log(data) //return undefined

根据您的说法，Meteor.method会返回依赖于其他馆藏的JSON。

所以我认为您在这里的最佳选择是在waitOn模板上使用myPage。

waitOn:function(){
 //return all the collection that the JSON depends
}

您可以尝试使用会话，也可以使用跟踪器。

var data = Meteor.call('myData');
Session.set('data',data)

//and later

     Template.myPage.rendered = functiopn(){
       Tracker.autorun(function(){
         var data = Session.get('data')
          if(data === undefined){
           //this is the long way
           console.log("Wait the data value still undefined")
          }else{
           //load all the D3 stuff
           console.log(data)
          }
       });
     }

GL

Answer 2

我会像这样尝试smth：

Template.myPage.rendered = function(){
    Meteor.call('myData', function(error,data){
       // if !error, data should be good
       var svgContainer = d3.select("#svg");

       var margin = 40;
       var width = parseInt(d3.select("#svg").style('width'),10);
       var height = parseInt(d3.select("#svg").style('height'),10);
    });
};

Answer 3

感谢twitter和@callmephilip 我找到了答案（我很惭愧，我自己也找不到了！：D）

唯一要做的就是将所有d3代码放在方法回调中：

Template.myPage.rendered = function(){
    Meteor.call('myData', function(err, result){
        if(err){
           console.log(err);
        }else{
             // all the D3.js code 
        }
    });
};

祝你有个美好的一天;）

Answer 4

你可以使用“流星反应法”。这是https://github.com/stubailo/meteor-reactive-method

的内联链接

然后在客户端

 Template.myPage.rendered = functiopn(){
   Tracker.autorun(function(){
     var data = ReactiveMethod.call('myData');
      if(data === undefined){
       //this is the long way
       console.log("Wait the data value still undefined")
      }else{
       //load all the D3 stuff
       console.log(data)
      }
   });
 }

在服务器

中

 Meteor.methods({
  myData: function() {
    return CollectionName.find().fetch()
 }
})

MeteorJS：模板呈现＆amp;流星方法调用

4 个答案: