Question

我有一个javascript函数，可以使用chrome API捕获最近检索的10个关闭的网站，然后将列表简化为带有标题和每个网站的url的对象数组。当我自己初始化时，Vue可以很好地显示该对象数组，但是在尝试使用该函数获取数组时它不起作用。 Vue为什么不显示任何内容？

如前所述，我已经尝试过自己初始化对象数组，并且这样显示它没有问题。但是，对其进行设置以便在渲染Vue之前，运行生成数组的功能仍无法解决问题。

var gotLast10;

function getLast10() {
  chrome.sessions.getRecentlyClosed({}, function (results){
    if (results.length > 10){
      results = results.slice(0, 10);
        var tempLast10 = [];
        results.forEach(
          function(eachSite) {
            var tempObject = { TITLE: eachSite.tab.title, URL: eachSite.tab.url}
            tempLast10.push(tempObject);
            gotLast10 = tempLast10;
          }
        );
    }
    });
    console.log(gotLast10);
}

$(document).ready(    
  function() {
    getLast10();
    vm = new Vue({
      el: '#app',
      data: {
        gotLast10: gotLast10,
      }
    });
  }
);
        <div id=app>
          {{ gotLast10 }}
        </div>

我希望Vue能够正常显示该对象，但最终却什么也不显示

Answer 1

尝试通过Vue实例更新数据。

vm.gotLast10 = tempLast10

此外，请确保在创建getLast10()后致电Vue。。

Vue未显示对象

1 个答案: