我试图做一些理论上应该简单的事情。我在Firebase中有以下数据结构:
<dom-module id="project-users">
<template>
<firebase-query
id="query"
path="/projects/{{project.id}}/users"
data="{{users}}">
</firebase-query>
<template is="dom-repeat" items="{{users}}" as="u">
user key: [[u.$key]]
<!-- now do something to retrieve the full user record and display it -->
</template>
</template>
</dom-module>
我有一个从父元素传递的项目ID,我想显示该项目的所有用户。
constructor(props) {
super(props);
this.state = {
sizes: [
{label: "90x50mm", isChecked: false, number: 10},
{label: "85x55mm", isChecked: false, number: 12}
],
ratings: [
{label: "OneStar", isChecked: false, imgSrc: 'images/Rating1Star.svg', counter: 22},
{label: "TwoStars", isChecked: false, imgSrc: 'images/Rating2Stars.svg', counter: 18},
{label: "ThreeStars", isChecked: false, imgSrc: 'images/Rating3Stars.svg', counter: 34},
{label: "FourStars", isChecked: false, imgSrc: 'images/Rating4Stars.svg', counter: 27}
],
favorites: [
{label: "Only favorites", isChecked: false, number: 12}
]
}
如何获得每个用户的完整用户记录,我是否需要在dom-repeat中包含一个标记?但那么它将如何异步工作?
或者这不是正确的方法吗?
非常感谢你的帮助。
答案 0 :(得分:2)
我会在这里重新发布我的解决方案,因为我无法弄清楚如何在评论中格式化代码: - )
最终我最终将每个用户记录放在它自己的组件中,如下所示:
<dom-module id="project-users">
<template>
<firebase-query
id="query"
path="/projects/{{project.id}}/users"
data="{{users}}">
</firebase-query>
<template is="dom-repeat" items="{{users}}" as="u">
<user-details uid=[[u.$key]]></user-details>
</template>
</template>
</dom-module>
然后在user-details.html中:
<dom-module id="user-details">
<template>
<firebase-document
path="/users/[[uid]]"
data="{{u}}">
</firebase-document>
[[u.name]]<br />
[[u.email]]<br />
[[u.tel]]<br />
</template>
</dom-module>