Polymer Firebase(Polymerfire)：在单页应用视图中无效(位于my-app.html中)

我正在尝试使用polymerfire和polymer App ToolBox模板将数据推送到Firebase：

> my-app.html包含已配置的< firebase-app>零件.
> my-models.html(在my-app.html路由中配置的页面)包含< add-model>零件
>< add-model>是一个带有< firebase-query>,< firebase-auth>,输入和提交按钮的表单.
>我尝试使用< firebase-query>推送数据使用add-model.html polymer对象中的以下函数：

polymer({
    is: 'add-model',properties: {
        data: {
            type: Object
        }
    },create: function() {
       this.$.query.ref.push({
           name: this.$.myModelName.value
        });
    }
});

结果
>调用< firebase-query>上的推送add-model.html中的对象返回无法读取未定义的属性“推送”(explained in this Q/A,在我们的例子中,因为< firebase-app>似乎没有正确声明).
>移动< firebase-app>从my-app.html到add-model.html文件确实使推送功能起作用,但随后my-app.html失去了Firebase功能.
>呼叫< firebase-app>在my-app.html和add-model.html中都会返回未捕获错误：名为“firebase-app”的Firebase应用已经存在.
>< firebase-auth>在add-model.html中工作并返回[[user]]对象.

如何使firebase-query与我的路由中的firebase-app正常通信？

解决方法

TLDR：解决方案是在与< firebase-app>相同的文件中导入polymerfire / polymerfire.html(即使不是该文件中使用的所有元素)宣言.

您的my-app.html可能会导入polymerfire / firebase-app.html(并且没有其他来自polymerfire的导入);并且my-models.html可能只导入polymerfire / firebase-query.html和polymerfire / firebase-auth.html,假设这些是该文件中使用的唯一的polymerfire元素.

我已经确定了原因(但不一定是根本原因).如果未在与< firebase-app>的声明相同的文件中导入polymerfire.html,则会出现症状.

polymerfire.html从polymerfire导入所有元素,包括Polymer.FirebaseCommonBehavior,它定义了所有polymerfire元素中看到的app属性.我猜测Firebase SDK需要在应用初始化之前导入所有polymerfire元素才能正确填充app对象.否则,当firebase-query初始化时,app.database will be undefined会阻止其ref property from initializing,当您尝试使用polymerfire元素的方法时会导致运行时错误.在$.query.ref.push(…)的情况下,看到的错误是：

Uncaught TypeError: Cannot read property 'push' of undefined

原文地址：https://www.jb51.cc/html/231725.html