Question

我正在与Polymer 3和polymerfire3一起工作。现在，我已经能够成功使用firebase-auth元素。但是，现在我尝试使用firebase-query元素，可以在控制台Uncaught TypeError: Cannot read property 'push' of null

上获得它

这是我的代码

import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
import './shared-styles.js';
import 'polymerfire3/firebase-auth.js';
import 'polymerfire3/firebase-query.js';

class PerfilView extends PolymerElement {
  static get properties() {
    return {
      user: Object,
      uid: String,
      data: {
        type: Object,
        observer: 'dataChanged'
      }
    };
  }

  static get template() {
    return html`

      <firebase-auth
        id="auth" user="{{user}}">
      </firebase-auth>

      <firebase-query
        log
        id="query"
        app-name="morse"
        path="/notes/"
        data="{{data}}">
      </firebase-query>

      <div class="card">
        <div id="notes">
          <ul id="notes-list">
            <template is="dom-repeat" items="{{data}}" as="note">
              <li>
                <p class="content">{{note}}</p>
              </li>
            </template>
          </ul>

          <paper-input value="{{inputP::input}}" label="Take a note.."></paper-input>
          <div id="notes-controls">
            <paper-button id="add" on-tap="add">Add</paper-button>
          </div>
        </div>
      </div>
    `;
  }
  add() {
    this.$.query.ref.push({
      content: this.inputP
    });
  }
}

window.customElements.define('perfil-view', PerfilView);

它与polymerfire3元素有关吗？

Answer 1

您将需要添加polymer-document才能添加记录。除了您的代码外，类似：

  <firebase-document
    id="document"
    app-name="morse"
    path="/notes/[[key]]"
    data="{{edata}}">
  </firebase-document>

并推送新数据可能看起来像;

add() {
    var key = firebase.database.ref('notes').push().key;
    this.set('edata', this.inputP);
    this.set('key', key); 
    // this new Note will be syncronised upon new key and edata properties defined. Here firebase-document will keep sysnronised with edata and path. 
}

Answer 2

firebase-query元素主要用于-

将给定属性组合到查询选项中，从而生成一个查询，是对经过筛选，有序，不可变的Firebase集的请求数据

Here进一步阅读。

我认为，您要尝试执行的操作可以简单地通过以下方式实现-

add(noteData) {
    let newNoteRef = firebase.app().database().ref('notes').push();

    return newNoteRef.set(noteData).then(() => {
       console.log(`a new note successfully added.`);
    });
}

成功数据upsert firebase-query会自动更新data有界变量以反映新列表。

聚合物3和polymerfire3的“未捕获的TypeError：无法读取null的属性'push'”

2 个答案: