问题标签 [vuefire]

我使用 Firebase 开发了一个基于 Vue.js 的小型网络应用程序来存储和同步数据。我存储items（例如，使用属性title和subtitle）和lists属性listitems，其中items存储了一组键（从 Firebase 生成的键）。结构如下所示：

现在的问题：我想显示一个列表并显示listitems属性中的项目，我这样做是这样的：

组件：

模板：

如您所见，我必须使用两次迭代，在其中迭代list.items.

我的问题：是否有更有效的方法将实际对象映射到对象键列表？对于大量的项目记录，我的方法会很慢。也许我太盲目了，看不到更简单的解决方案？

谢谢你的时间！

我是 Vue 和 Firebase 的新手。在 VueJS 中，我试图复制 Firebase friendlychat 函数，该函数返回存储在 Firebase 存储 (FriendlyChat.prototype.setImageUrl) 中的图像的正确图像 URL。我在 vue 组件中定义了这个函数：

而在 HTML 模板中，如果我只是尝试调用该函数，它就不起作用。

我无法在 Vue 中找出正确的方法来获取此函数的结果（因为它是一个承诺？）任何帮助表示赞赏！

我有一个与 Firebase 同步的组件。我希望组件的实例具有一些不会同步到 Firebase 的属性：

title应该保存到数据库中，但isShown不应该，因为它只是用来在浏览器中显示和隐藏元素。

有没有办法在不将它们同步到 Firebase 的情况下向组件实例添加反应属性？

我创建了一个 Vue/Vuefire 组件，用于编辑现有的 Widget 并将编辑内容保存到 Firebase。

小部件上的一些反应性属性不应保存到 Firebase，例如错误消息以及小部件当前是否显示。所以我将所有 Firebase 数据存储在一个firebaseData属性中：

问题是保存数据时，我总是得到错误First argument contains an invalid key (.key)。我的解决方案是显式删除该.key属性，如上所述。

这感觉就像代码的味道。有没有办法不必这样做？

在使用 Vue 和 Firebase 的简单 SPA 中，有两种路由：登录和聊天。

登录后，用户将被重定向到 Chat 路由，在该路由中，Firebase 数据库绑定是在生命周期钩子$bindAsArray()内使用 vuefire 手动完成的。created()这是因为绑定需要uidFirebase 身份验证分配的可用。

这工作正常，直到用户刷新页面。如果auth().currentUser用于获取uid，则返回 null。如果auth().onAuthStateChanged()使用了 watcher，Vue 会在 Firebase 数据库绑定完成之前尝试渲染组件。我错过了什么？

我有一个简单的管理应用程序，它通过表单创建新业务并将它们添加到表中。我已经创建了添加和删除条目的方法，但不确定如何继续创建更新方法。内容是 contenteditable，我想在单击保存按钮时保存它。请查看我的 CodePen：http ://codepen.io/Auzy/pen/177244afc7cb487905b927dd3a32ae61为此，我使用 VueJS 和 Vuefire 以下方式（请原谅 Bootstrap）：

和 JS：

我有一个与 Firebase JSON 数据库一起使用的简单 VueJS 应用程序。我希望能够单击箭头来更新评论的“投票”。（类似于本网站的投票方式）。我的功能运行。但是 Vue 模型从不更新 Firebase，因此刷新时会丢失投票计数。请参考我的 CodePen：http ://codepen.io/Auzy/pen/evowdd/ （请注意，我使用 Pug 和 Stylus，要查看正常的 HTML/CSS，请单击右上角的箭头。）

JS：

我在从 VueFire 更新 Firebase 时遇到了一些问题。我正在尝试使用以下方法，但如果我将任何字段留空（这应该在设置中经常发生），它会对我大喊大叫。知道为什么如果 .update 使用空白字段会生气吗？

错误：未捕获错误：Firebase.update 失败：第一个参数在属性“businesses.somebusiness.video”中包含未定义

有一次，我将上面的内容重写为：

它的效果非常好，但删除密钥似乎会导致 Vue 中出现奇怪的排序问题。如果我能找到一种方法在留空时不让它出错，我宁愿坚持使用顶级方法。

我目前正在使用 VueJS、Firebase 和 VueFire 创建一个项目。我遇到的问题是订购最新到最旧的帖子列表。

我尝试使用 Firebase 的内置查询，例如list.orderByChild('date')，但没有运气。

我知道我需要使用Array.sort((a,b) => { return new Date(a.date) - new Date(b.date) })它，但我很难将其与 VueFire 一起使用，或者甚至用它创建一个 Vue 过滤器。

让我知道我是否可以提供其他任何东西。

这是我的数据库的样子：

这是我的代码：

我有这个损坏的 CodePen，我试图根据对象.key或 id 在另一个 Firebase Ref 中获取对象的信息......

我必须 Firebase Refs：内容

以及通过键列出对象的相关项，然后是与该项目相关的对象的键。

我正在尝试使用以下代码按键通过relatedRef：

然后获取与之相关的对象的数据并将其记录到控制台：

目前，当我需要它返回相关引用中引用的 contentRef 中的对象信息时，它返回 null ......有什么想法吗？