Polymer 1.x：iron-data-table在内置neon-animated-pages时不会在第一次渲染时加载数据或标题样式

Question

下面的屏幕截图显示了我的iron-data-table元素首次加载时的外观。请注意，数据丢失且标题未完全格式化（宽度似乎太小而无法显示列标题标签）。

但是，如果我在过滤器字段中输入一个字符或单击其中一个排序按钮，iron-data-table似乎会重新绘制自己并且看起来很好。列和标题正确呈现，数据按预期填充表。

当我将一些目录添加到我的文件结构嵌套iron-data-table neon-animated-pages内部时，此问题就开始了。我仔细检查，我的所有导入都正确加载。但我怀疑，不知何故，在获取数据方面存在轻微延迟，并且表格可能会在数据到达之前尝试呈现，并且在数据到达后不会刷新。

所以我尝试添加以下功能。但无济于事。 render()没有iron-data-table方法。

<iron-data-table id="grid" ...

....

attached: function() {
  this.async(function() {
    this.$$('#grid').render();
  }.bind(this), 500);
},

可能导致此行为的原因是什么？我接下来应该尝试什么？

修改

This plunk demonstrates the desired iron-data-table behavior

This plunk demonstrates my problem behavior。 （尚未完成。目前正在进行中。）

配置大致如下。

家长el.html

<neon-animated-pages>
  ...
  <container-el...>...</container-el>
</neon-animated-pages>

容器el.html

<child-el ...>...</child-el>

儿童el.html

<iron-data-table ...></iron-data-table>

编辑2

根据@SauliTähkäpää的评论，我尝试了以下修复失败。

家长el.html

<neon-animated-pages id="animator" ...>
  ...
  <container-el...>...</container-el>
</neon-animated-pages>

...

attached: function() {
  this.async(function() {
    this.$.animator.notifyResize();
  }.bind(this), 50);
},

Answer 1

不熟悉def get_axis(obj, axis=0): if isinstance(obj, pd.Panel): m = pd.Series(['items', 'major_axis', 'minor_axis']) else: m = pd.Series(['index', 'columns']) return obj.__getattribute__(m.loc[axis]) print(get_axis(pn, 2)) print(get_axis(pn, 1)) print(get_axis(pn, 0)) print(get_axis(df, 1)) print(get_axis(df, 0)) ，但通过查看文档，只要他们扩展Index([u'A', u'B', u'C'], dtype='object') Index([u'a', u'b', u'c'], dtype='object') Index([u'X', u'Y', u'Z'], dtype='object') Index([u'A', u'B', u'C'], dtype='object') Index([u'a', u'b', u'c'], dtype='object') ，就应在所选网页上调用neon-animated-pages。

所以我认为你的选择是确保notifyResize()和树中的其他元素正在扩展iron-resizable-behavior或覆盖<container-element>以直接通知网格。点击此处：https://elements.polymer-project.org/elements/neon-animation?active=neon-animated-pages#method-resizerShouldNotify

Answer 2

为稍后关注此问题的任何人说明

Per @SauliTähkäpää接受的答案，我成功地将以下代码添加到链中的每个元素（即，从包含neon-animated-pages的元素开始，以包含{{1}的元素结束在这个示例中，这将是iron-data-table，parent-el和container-el）。

parent-el.html，container-el.html，child-el.html。

child-el