1

我有一个组件,它获取一些数据。路径是动态的,因为它内部有一个绑定。

然后我有一些动态改变路径的链接。我希望数据列表会相应更新。

当我第一次加载页面时,一切正常,但是每当我单击链接以更新路径(并因此获取新数据)时,它什么都不返回。

我检查了观察者的情况,看起来每当我更新路径时,数据都会更新两次:首先它返回我期望的实际数据,然后它返回一个空数组。

这是组件:

<dom-module id="test-one">

  <template>

    <firebase-query app-name="main" path="/templates/[[template]]" data="{{items}}"></firebase-query>

    <a on-tap="changeTemplate" data-template="template1">Template 1</a><br />
    <a on-tap="changeTemplate" data-template="template2">Template 2</a><br />

    <p>Current template is [[template]]</p>

    <template is="dom-repeat" items="{{items}}" as="item">
      [[item.ref]] - [[item.description]]<br />
    </template>

  </template>

  <script>
    Polymer({
      is: 'test-one',
      properties: {
        items: {type: Array, observer: "dataChanged"},
        template: {type: String, value: "template1"},
      },
      dataChanged: function(newData, oldData) {
        console.log(newData);
      },
      changeTemplate: function(e) {
        elm = e.currentTarget;
        template = elm.getAttribute("data-template");
        console.log("link has been clicked, we're changing to "+template);
        this.set("template", template);
      }
    });
  </script>

</dom-module>

这是我单击其中一个链接时控制台显示的内容:

在此处输入图像描述

似乎有一些不同步的巫术正在发生 - 关于如何解决这个问题的任何想法?

4

2 回答 2

2

这实际上是firebase-query中的一个错误,已通过以下拉取请求修复: https ://github.com/firebase/polymerfire/pull/167 。

这里已经报道过:https ://github.com/firebase/polymerfire/issues/100

于 2017-01-20T06:53:42.267 回答
1

看起来这是 Polymerfire 中的错误。现在,对您的本地副本进行以下更改firebase-database-behavior.html将解决问题,看似没有工件,但这确实需要一个错误报告。我一有机会就会填写错误报告,他们往往来回耗费大量时间:(

只需将 86 行注释掉firebase-database-behavior.html。新__pathChanged功能应该是这样的。

__pathChanged: function(path, oldPath) {
  if (oldPath != null && !this.disabled && this.__pathReady(path)) {
    this.syncToMemory(function() {
      // this.data = this.zeroValue;
    });
  }
},

这是怎么回事

当路径更改时,会写入代码以将旧值清零,并且此代码存在于 中firebase-databse-behavior.html,它firebase-query继承。这是有道理的,但是已经在第 279 行将firebase-query数据清零了。__queryChangedfirebase-query.html

__queryChanged: function(query, oldQuery) {
  if (oldQuery) {
    oldQuery.off('child_added', this.__onFirebaseChildAdded, this);
    oldQuery.off('child_removed', this.__onFirebaseChildRemoved, this);
    oldQuery.off('child_changed', this.__onFirebaseChildChanged, this);
    oldQuery.off('child_moved', this.__onFirebaseChildMoved, this);

    this.syncToMemory(function() {
      this.set('data', this.zeroValue);
    });
  }

  if (query) {
    query.on('child_added', this.__onFirebaseChildAdded, this.__onError, this);
    query.on('child_removed', this.__onFirebaseChildRemoved, this.__onError, this);
    query.on('child_changed', this.__onFirebaseChildChanged, this.__onError, this);
    query.on('child_moved', this.__onFirebaseChildMoved, this.__onError, this);
  }
},

路径的变化首先由第 23 行中的firebase-queryby观察到。然后触发将旧数据清零并设置 firebase 事件处理程序以观察对 firebase 数据库的更改。随后,调用in再次将数据清零,但在新数据已由 firebase 事件处理程序写入之后。__computeQueryfirebase-query.html__queryChanged__pathChangedfirebase-database-behavior.html

于 2017-01-20T00:27:20.977 回答