子属性更改时重新评估对象绑定

re-evaluating an object binding when a sub property changes

本文关键字:评估 对象 绑定 新评估 属性      更新时间:2023-09-26

我正试图将数据提供程序包装在自定义元素中,以便在应用程序中使用中介器模式,但我对遇到的这种行为有点困惑。

这是我的数据提供商的缩写版本:

<dom-module id="archive-data">
  <script>
  (function () {
    //some helper functions 
    //...  
    var api = {
      is: 'archive-data',
      properties: {
        archive: {
          type: Object,
          value: { 
            name: value,
            ...,
            meetings: [] 
          },
          notify: true
        }
      },
      ready: function () { this.update(); },
      update: function () {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
          if (xhr.readyState == XMLHttpRequest.DONE) {
            var data = HELPERS.extractResult(xhr.response);
            this.archive.meetings = someFunction(data);
          }
        }.bind(this);
        xhr.open("POST", "serverAPI.cfc?method=getData");
        xhr.send();
      }
    };
    Polymer(api);
  }());
  </script>
</dom-module>

这个想法是,这个东西将异步地从后端请求一些数据。稍后,如果应用程序对数据库进行了更改,则中介器可以在此提供程序上调用update(),并且在archive上具有绑定的任何元素都将获得更新。

因此,中介可以使用以下提供程序:

<archive-data archive="{{archive}}"></archive-data> 
<other-element my-data="[[archive]]"></other-element>

我遇到的问题是数据绑定不起作用。我想知道为什么。据我所知,医生说它应该有效:

实现了聚合物中的双向数据绑定和路径观察使用与上述双向属性类似的策略绑定:

当使用type: Object配置的属性的子属性更改时,元素激发一个不冒泡的<property>-changed DOM事件其中CCD_ 5值指示对象上的路径已更改。

已登记对该对象感兴趣的元素(通过绑定或更改处理程序)然后可以采取适当的动作。

最后,这些元素将把通知转发给他们将对象绑定到的孩子,还将发射一个新的属性为根对象的<property>-changed事件,以通知任何可能已绑定根对象的主机。

我尝试过:this.set('archive.meetings', someFunction(data));而不是直接分配,但没有成功

我还试着在作业后直接运行:this.fire('archive-changed');,但也不起作用!

但是,如果我将整个archive对象替换为新对象,则绑定将按预期重新计算。例如this.archive = { meetings: someFunction(data) };

我认为有必要通知Polymer您的路径发生了更改,如下所示:

this.notifyPath('archive.meetings', this.archive.meetings);

以下是官方文件中的完整示例:

<dom-module id="custom-element">
  <template>
    <div>{{user.manager.name}}</div>
  </template>
  <script>
    Polymer({
      is: 'custom-element',
      reassignManager: function(newManager) {
        this.user.manager = newManager;
        // Notification required for binding to update!
        this.notifyPath('user.manager', this.user.manager);
      }
    });
  </script>
</dom-module>

我看到了this.set('user.manager', newManager);有错误

未捕获类型错误:this.set不是函数在XMLHttpRequest.xhr.onreadystatechange