Question

我试图使用chart.js绘制图表。当我使用静态数字时，我能够使用onRendered显示图表，但是当我尝试通过从集合中获取数据来创建变量时，变量返回undefined。我认为这是一个加载顺序问题。

Template.communication.onRendered(function() {
  // Get the context of the canvas element we want to select
  var ctx  = document.getElementById("myChart").getContext("2d");

  // get user data for charts
  var id = FlowRouter.getParam('id');
  var user = ProfessionalOverview.findOne({"candidateUserId": id});
  var communicationSkills = user && user.communicationSkills;

  // Set the data
  var data = {
    labels: ["Communication skills"],
    datasets: [
      {
        data: [communicationSkills, 2],
        backgroundColor: [
          "#FF6384",
          "#F2F2F2",
        ]
      }]
    };

    // And for a doughnut chart
    var myDoughnutChart = new Chart(ctx, {
      type: 'doughnut',
      data: data,
      options: {
        cutoutPercentage: 50,
        tooltips: false,
        legend: {
          labels:{
            display: true,
            boxWidth: 0
          },
          onClick: (e) => e.stopPropagation(),
        },
        animation:{
          animateRotate: true,
          render: false,
        },
      }
    });

  });

Answer 1

你有竞争条件，我会打电话给你。你没有显示你订阅的位置，我认为它在onCreated（）中。如果是，是的，无法保证在您查找时数据准备就绪。

典型的解决方案是将您的查找包装在自动运行中，如下所示：

this.autorun(function() {
    var user = ProfessionalOverview.findOne({"candidateUserId": id});

    if (user) {
        // rest of the code that uses this data
    }
});

你也可以使用集合isReady Callback来实现相同的

this.autorun(function() {   
    if (ProfessionalOverview.isReady()) {
        var user = ProfessionalOverview.findOne({"candidateUserId": id});
        // rest of the code that uses this data
    }
});

通过＆＃34;如果＆＃34;保护它，在数据出现之前，你不会做任何工作。

findOne在onRendered中返回undefined

1 个答案: