数组值未显示

时间:2017-10-11 10:23:16

标签: javascript arrays firebase firebase-realtime-database

我有一个帮助显示图像缩略图的功能 我最初以这种格式调出变量

(function(){
var catalog = {

thumbnails: [
  'https://farm6.staticflickr.com/5576/18670011368_b25a92d37e_k.jpg',
  'https://unsplash.imgix.net/photo-1428930377079-45a584b6dd6b?fit=crop&fm=jpg&q=75&w=1050',
  'https://unsplash.imgix.net/photo-1428976365951-b70e0fa5c551?fit=crop&fm=jpg&h=700&q=75&w=1050',
  'https://ununsplash.imgix.net/photo-1422207134147-65fb81f59e38?fit=crop&fm=jpg&h=800&q=75&w=1050',
]
.
.
.
catalog.init();

我需要用firebase中的imageUrls替换缩略图,所以我创建了一个空数组和一个获取某些变量和图像的快照值的函数

var thumbnails = [];

function showproductpage(element){


var itemdetailref = Cataloguedatabase.ref('/Listings/'+ listingID);

return itemdetailref.once('value').then(function(snapshot){
    var results=snapshot.val();
 var mainimage = results.ProductImageUrl;
 var thumbnail1 = results.ProductImage1Url;
 var thumbnail2 = results.ProductImage2Url;

  thumbnails.push(mainimage,thumbnail1,thumbnail2);

}

所以我更新的缩略图功能如下所示

(function(){
var catalog = {

thumbnails ,
....

catalog.init();
})()

但是当我运行时,没有图像出现缩略图,控制台上也没有显示错误。我做错了什么,如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

在加载图像之前调用自调用函数。尝试在自动调用函数中替换图像。

编辑:

正如评论中所提到的,函数的异步性质也很重要。调用函数时,程序的执行继续,因此数组为空。我建议您使用Promise对象,然后将其他操作与thumbnails链接起来。