React组件迭代/循环Mongo对象的属性

Question

我确实有一个Mongo collection，它存储带有预定义的图像"插槽"的相册，如果有一种方法可以循环收集的属性，以便在分开的div中显示图像，则感觉有点卡住。

我确实使用了这个代码来映射专辑封面，它工作得很好:

albums() {
  return Albums.find().fetch();
}
{this.albums().map( (album) => {
  return <div key={album._id}><img src={album.cover} /></div>
 })}

但是现在我请求你帮助，是否有可能在photoOne, photoTwo等上循环…和跳过/不显示数据，如果它是空的，比如在photoThree中。

{
    "_id" : "CHMHbNWWwZGaLGvB6",
    "title" : "Text",
    "cover" : "link",
    "createdAt" : date,
    "photoOne" : {
        "titleOne" : "Text",
        "coverOne" : "link"
    }
    "photoTwo" : {
        "titleTwo" : "Text",
        "coverTwo" : "link"
    }
    "photoThree" : {
        "titleThree" : "",
        "coverThree" : ""
    }
}

Answer 1

我不是Mongo用户，但是在map函数中您可以检查现有值，并在那里处理它。类似于(当然肯定有更简洁的方法):

   this.albums().map( (album) => {
       for (key in album){
         if (key.startsWith('photo')){
           var title = Object.keys(album[key])[0];
           if (album[key][title].length != 0){
             console.log("Can use: " + Object.keys(album[key])[0])
           }
         }
       }
   })

结果为:

Can Use This: titleOne
Can Use This: titleTwo

希望能有所帮助，但似乎photoOne, photoTwo的照片限制了使用的照片数量，并且需要使用Object。键来获取值(没有特别使用album)。photoOne,专辑。照片二等

如果相册照片存储在嵌入式文档中，您可以只包含存在的照片和标题，而不必检查空的。你只需要循环浏览现有的照片....