0

我目前正在搞乱 pebble.js (sdk 2.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”时它什么也没做，其他人都知道为什么它不会将数据加载到菜单中

4

2 回答 2

0

我没有意识到：var matchMenu = new UI.Menu，当时在那里创建了菜单，所以当dataJSON满时，菜单已经制作好了，一旦dataJSON满了就通过创建菜单来修复。

于 2015-02-28T11:15:57.430 回答
0

就像您在自己的回答中提到的那样，您menu在第一次调用时就做出了正确的选择var matchMenu = new UI.Menu。解决这个问题的方法是两种方法之一。

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

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

此外，在我建议的方法中，您可以放入一个基本菜单，让用户知道是否显示我们在加载信息时遇到问题。

于 2015-08-03T14:17:46.467 回答