私はreactjsとfirebaseを使用していると私はfirebaseからフェッチされたデータをレンダリングするための問題があります。Firebaseデータベースコールを同期させるにはどうすればいいですか?
私のreactjsコンポーネントはデータの前にロードされるので、私のウェブページがロードされると、データが表示されるまで少し時間が空白のままです。
しかし、データがロードされていない状態でページをロードしたくない場合は、前にロードしてください。だから、私はコンストラクタの状態を操作しようとしましたが、私は問題がfirebaseから来ると思います。 firebaseもconstructor()
とcomponentDidMount()
で非同期にデータをフェッチするのでそうrender()
はfirebaseがデータを送信するために完了しなかった場合でも呼ばれています。
firebaseが結果を送信しないで反応を完全に防ぐことはできますか?
constructor(props){
super(props)
post = database.ref().child('posts').orderByKey().equalTo(id)
post.once('value').then(snap => {
// I get the snap here but i don't want my page to render before
// all data queried have been fetched
}).then(function(){
// I've tried to add a "then" callback but it doesn't work
// Render is still displayed too soon
})
}
render(){
let data = this.state.data
return(
// simple example
<span>{this.state.data}</span>
)
}
感謝。
ありがとうございます。あなたは私の問題を解決しました。私はReactDomRenderのすべてのものをロードし、すべてが完璧です。 – John