我有一个react.js组件,我打算从firebase中的两个不同节点顺序提取数据。这是代码。但它不起作用:
async componentDidMount() {
const publisherID = this.props.match.params.id;
const that = this;
const soundcasts = [];
const publisher = await firebase.database().ref('publishers/' + publisherID).once('value');
const soundcastsArr = Object.keys(publisher.val().soundcasts);
console.log('soundcastsArr: ', soundcastsArr);
let soundcast;
for(let i = 0; i < soundcastsArr.length; i++) {
console.log('for block called');
soundcast = await firebase.database().ref(`soundcasts/${soundcastsArr[i]}`).once('value');
console.log('soundcast: ', soundcast.val());
console.log('i: ', i);
}
}
我能够看到soundcastsArr
的console.log和第一个console.log('for block called');
,但不能看到其余的soundcast = await firebase.database().ref(
。似乎循环停止在行).once('value');
soundcasts / $ {soundcastsArr [i]} await
并且没有错误显示。
这里变得更加奇怪。如果我在for循环中添加另一个soundcasts
以从其他节点检索数据,就在从for(let i = 0; i < soundcastsArr.length; i++) {
console.log('for block called');
const user = await firebase.database().ref(`users/reionviorfruinjkd343fsk`).once('value');
console.log('user: ', user.val());
soundcast = await firebase.database().ref(`soundcasts/${soundcastsArr[i]}`).once('value');
console.log('soundcast: ', soundcast.val());
console.log('i: ', i);
}
节点检索之前,如下所示:
console.log
它使一切正常,我得到每个await
来显示。
这对我来说似乎很奇怪。
任何火力专家都能对此有所了解吗?
更新:现在正在运行。事实证明,for循环中的var CardSchema = new mongoose.Schema({
beName: String,
beLink: String,
cards: [{
cardType: String,
cardBundle: String
}]
确实有效。但无论出于何种原因,从该特定节点检索数据需要很长时间。因此,在组件继续执行其他功能之前,我没有看到任何console.log。将加载指示符添加到组件中现在一切都很好。
答案 0 :(得分:0)
你正在接近一系列承诺的概念。首先构建promises数组,然后在该数组上使用Promise.all
。不要await
每个人。
const soundcastPromises = soundcastsArr.map((soundcast) => {
return firebase.database().ref(`soundcasts/${soundcastsArr[i]}`).once('value')
})
const resolvedSoundcasts = await Promise.all(soundcastPromises)
这是为了修复你对Promise.all
的使用。我无法确定您的查询为什么会挂起。