Firebase 與 AngularJS 結合使用,可以高效地獲取數據,包括用戶列表。雖然使用 Once() 函數存取使用者清單沒有任何困難,但在該函數的範圍之外檢索它卻是難以捉摸的。本文探討了根本原因並提供了全面的解決方案。
Firebase 的資料擷取是非同步運作的,導致程式碼執行呈現非線性。為了說明這一點,請考慮以下程式碼片段:
this.getUsers = function() { var ref = firebase.database().ref('/users/'); ref.once('value').then(function(snapshot) { // User list processing console.log(users); // Output: All users }); console.log(userList); // Output: Undefined }
執行時,儘管 then() 區塊中成功檢索,但最終的預期使用者清單輸出仍然難以捉摸。出現這種情況是因為程式碼執行順序不正確:
1.利用回呼
直接的方法是將所有與使用者清單相關的程式碼轉移到回調函數中。這將邏輯從“加載列表然後打印”重組為“每當加載列表時就打印”。
ref.once('value', function(snapshot) { // User list processing console.log(users); // Output: All users })
2.利用 Promise 和回呼
Promise 提供了更優雅的解決方案,讓您從 getUsers() 函數傳回 Promise。這允許您像以前一樣使用 Once() 回調,但帶有額外的承諾包裝:
this.getUsers = function() { return ref.once('value').then(function(snapshot) { // User list processing return users; }) ... userService.getUsers().then(function(userList) { console.log(userList); })
3。擁抱Async/Await
透過使用Promise,您可以利用async/await 語法來實現看起來更同步的方法:
async function getAndLogUsers() { const userList = await userService.getUsers(); console.log(userList); }
但是,這一點很重要需要注意的是getUsers() 函數仍然是一個非同步函數,需要呼叫程式碼相應地處理Promise 或Future。
透過採用這些策略,您可以有效地利用 Firebase 的非同步功能並防止超出範圍的參考遺失Once() 函數的作用域。
以上是使用 Firebase 非同步取得資料時如何防止引用遺失?的詳細內容。更多資訊請關注PHP中文網其他相關文章!