在 firebase 和 vue 中处理异步数据加载的最佳方法

Posted 2023-02-22

【中文标题】在 firebase 和 vue 中处理异步数据加载的最佳方法

【英文标题】：Best way to handle async data loading in firebase and vue

【发布时间】：2021-08-20 02:12:33

【问题描述】：

您好，我想知道在 vue 应用程序中处理异步代码的最佳方法是什么。我基本上想从 firebase 中提取数据，然后运行我的设置功能。我的页面完全取决于从 firebase 提取的数据，所以我不介意在 firebase 提取数据时它是否不加载。

即使我尝试不同的异步等待方法，我也会不断收到未定义的错误等。我想在页面呈现之前在 setup 函数中访问这些数据。

谢谢！！

【参考方案1】：

假设来自 firebase 的数据称为 myData。为标记提供两个分支：一个用于数据准备就绪，一个用于数据未准备好。

<div v-if="myData">
  markup assumes myData is ready
</div>
<div v-else>
  markup doesn't use myData, perhaps indicates "loading..."
</div>

在代码中，可能在生命周期的早期，使用异步工作的结果初始化 myData。

【讨论】：

好的，非常感谢！这是标准的最佳实践还是更多的解决方法

我认为这是@danh 的一个很好的起点。一方面，仍然缺少错误管理。这基本上是 v-if/v-else 的另一层。

@atx123n，是的，我认为说这是最好的方法是对的。 UI 的工作是向用户呈现系统状态。这个 UI 的意思是“未初始化，但正在处理它”是一个有效的，虽然是临时的，状态。