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中文网其他相关文章!