聚合物 template.render() 不可靠

Question

我使用以下简化形式的代码。我有一个显示商店列表的模板，来自 _stores 数组。根据在应用程序中设置的一些其他属性，_sort 和 _filter 函数可以很好地完成各自的工作并显示我想要查看的列表。

当我重新计算每个商店的距离时（运行 _stores trough calculateDistance）我想通过调用 _search() 重新渲染商店列表，它调用 Polymer .render() 函数。

此调用不可靠：有时会呈现，有时不会。 它发生在桌面和移动设备、Safari 和 android 上，所以它看起来像是一个聚合物问题。我找不到造成这种情况的原因。有什么想法吗？

 <template id="storeList" is="dom-repeat" items="{{_stores}}" sort="_sort" filter="_filter">
      <div class="search_result">
        <div class="picture">

          <div class="logo" hidden$="{{!item.logo.length}}">
            <div class="centered">
              <img src$="{{item.logo}}" alt="logo" />
            </div>
          </div>....
</template>


<script>
Polymer({
  is: 'user-store-search-page',

  properties: {
    ...
    _stores: Array
    ...
    },
    _calculateDistance: function () {
       this._stores.forEach(s) {
           //do stuff per store

       }
    },
    _filter: function (store) {
         //do filtering stuff
    },
    _sort: function (a, b) {
         //sort stuff
    },
    _search: function () {
        this.$.storeList.render();
    }

Answer 1

我会利用计算属性优势重新呈现对 _stores 数组执行的任何操作的列表:)

 <template id="storeList" is="dom-repeat" items="[[_displayStores]]" sort="_sort" filter="_filter">
  <div class="search_result">
    <div class="picture">

      <div class="logo" hidden$="{{!item.logo.length}}">
        <div class="centered">
          <img src$="{{item.logo}}" alt="logo" />
        </div>
      </div>....
</template>


<script>
Polymer({
  is: 'user-store-search-page',

  properties: {
    ...
    _stores: Array,
    _displayStores: {
      type: Array,
      computed: '_computeStoresToDisplay(_stores.*)'
    }
    ...
    },
    _computeStoresToDisplay: function(stores) {
      return stores.value;
    },
    _calculateDistance: function () {
       this._stores.forEach(s) {
           //do stuff per store

       }
    },
    _filter: function (store) {
         //do filtering stuff
    },
    _sort: function (a, b) {
         //sort stuff
    },
    _search: function () {
        this.$.storeList.render();
    }
</script>

聚合物 template.render() 不可靠

Polymer template.render() is unreliable

javascript

polymer