Pebble.js未从JSON源加载菜单数据

Question

我目前正在摆弄pebble.js (SDK2.0)，我正在尝试制作一个基于菜单的应用程序，它可以从JSON源加载数据。

我可以让一切正常工作，除了填充菜单部分。下面是我的代码：

    var UI = require('ui');
var ajax = require('ajax');
var dataJSON = [];

var fruits = [
  {
    title: "Apple",
    subtitle: "Green and crispy!"
  },
  {
    title: "Orange",
    subtitle: "Peel first!"
  },
  {
    title: "Melon",
    subtitle: "Only three left!"
  }
];

var parseFeed = function(data, quantity) {
  var items = [];
  for(var i = 0; i < quantity; i++) {
    var teamOne = data.matches[i].team1.team_tag;
    var teamTwo = data.matches[i].team2.team_tag;
    var startTime = data.matches[i].starttime;
    var title = (teamOne + ' vs ' + teamTwo);
    var time =  (startTime.substring(11) + " CET" );
    items.push({
      title:title,
      subtitle:time
    });
  }
  return items;
};

var matchMenu = new UI.Menu({
  sections: [{
    title: 'D2MT',
    items: dataJSON
  }]
});



ajax({
    url:'http://dailydota2.com/match-api',
    type:'json'
  },
  function(data) {
    dataJSON = parseFeed(data, data.matches.length);

    for(var i = 0; i < fruits.length; i++) {
      console.log('title = ' + fruits[i].title);
      console.log('subtitle = ' + fruits[i].subtitle);
    }
    for(var j = 0; j < dataJSON.length; j++) {
      console.log('title = ' + dataJSON[j].title);
      console.log('subtitle = ' + dataJSON[j].subtitle);
    }
    console.log('SHOW MENU');
    matchMenu.show();
  },
  function(error) {
    console.log('Download failed: ' + error);
  }
);

以下哪项输出：

[PHONE] pebble-app.js:?: title = Apple
[PHONE] pebble-app.js:?: subtitle = Green and crispy!
[PHONE] pebble-app.js:?: title = Orange
[PHONE] pebble-app.js:?: subtitle = Peel first!
[PHONE] pebble-app.js:?: title = Melon
[PHONE] pebble-app.js:?: subtitle = Only three left!
[PHONE] pebble-app.js:?: title = Rave vs 5eva
[PHONE] pebble-app.js:?: subtitle = 14:00:00 CET
[PHONE] pebble-app.js:?: title = Arcanys vs XctN
[PHONE] pebble-app.js:?: subtitle = 14:30:00 CET
[PHONE] pebble-app.js:?: title = VP vs Meepwn'd
[PHONE] pebble-app.js:?: subtitle = 17:00:00 CET
[PHONE] pebble-app.js:?: title = Vega vs NiP
[PHONE] pebble-app.js:?: subtitle = 17:00:00 CET
[PHONE] pebble-app.js:?: title = Secret vs Empire
[PHONE] pebble-app.js:?: subtitle = 20:00:00 CET
[PHONE] pebble-app.js:?: title = SumsRift vs HR
[PHONE] pebble-app.js:?: subtitle = 20:00:00 CET
[PHONE] pebble-app.js:?: title = NiP vs Vega
[PHONE] pebble-app.js:?: subtitle = 20:30:00 CET
[PHONE] pebble-app.js:?: title = Fire vs Thu
[PHONE] pebble-app.js:?: subtitle = 23:00:00 CET
[PHONE] pebble-app.js:?: title = Signature vs G Guard
[PHONE] pebble-app.js:?: subtitle = 08:00:00 CET
[PHONE] pebble-app.js:?: title = Aces vs MVP
[PHONE] pebble-app.js:?: subtitle = 11:00:00 CET
[PHONE] pebble-app.js:?: SHOW MENU
[PHONE] pebble-app.js:?: (+) [menu 1] : [menu 1]

菜单加载‘水果’很好，但是当我加载'dataJSON‘时，它什么也做不了，其他人都知道它为什么不把数据加载到菜单中

Answer 1

我没有意识到：var matchMenu = new UI.Menu，当时就创建了菜单，所以当dataJSON满了的时候，菜单已经做好了，修复了在dataJSON满了的时候创建菜单的问题。

Answer 2

就像您在自己的答案中提到的那样，您是在第一次调用var matchMenu = new UI.Menu时创建menu。解决这个问题的方法有两种。

您可以按照您所提到的方式进行操作，并在检索数据后创建menu，但是这样就限制了调用该menu的时间和方式。您很可能是在一个函数中创建了该menu，这使得它有很多开销来再次加载它。

您真的应该按照开始的方式进行操作，但是在显示之前将dataJSON添加到menu中。这将允许您灵活地拥有一个全局可寻址的menu，您可以在应用程序中进行更新，而不是每次都需要再次调用服务器加载的信息。