聚合物元素 css 未显示 - 检查员没有错误答案

【问题标题】：polymer element css not showing - no errors in inspector聚合物元素 css 未显示 - 检查员没有错误
【发布时间】：2016-04-04 12:26:32
【问题描述】：

我正在使用 Polymer，并且有一个如下所示的 index.html：

<!doctype html>
<html>
<head>
  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no">
  <title>Testing polymer</title>

  <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
  <link rel="import" href="bower_components/paper-tabs/paper-tabs.html">

</head>
<body unresolved fullbleed layout vertical center center-justified style="height: 100vh; margin: 0">
    <template is="auto-binding">
      <paper-tabs selected = "{{selectedPage}}">
        <paper-tab>Page 0</paper-tab>
        <paper-tab>Page 1</paper-tab>
        <paper-tab>Page 2</paper-tab>
        <paper-tab>Page 3</paper-tab>
      </paper-tabs>

    </template>
</body>
</html>

然后我使用以下命令启动服务器：

python -m SimpleHTTPServer

并导航到 localhost:8000。加载页面后，没有任何显示。这只是一个空白页。当我检查 JS 控制台以查看是否有任何错误时，没有。如果我检查元素选项卡，它们都在那里。此外，当我检查每个单独元素的样式选项卡时，它完全没有显示任何内容。我只是得到标准的橙色、黄色、绿色、蓝色盒子。

我正在使用 Polymer 库中包含的纸张选项卡，并且没有以任何方式操纵它们的 CSS。怎么了？我安装错误了吗？任何帮助，将不胜感激。

【问题讨论】：

我认为问题不在于css没有显示，而是元素没有加载，您是否在html代码中看到了paper-tab的任何内容（在元素选项卡中）？
是的，这是检查器中的样子：Page 1Page 2第3页

标签： javascript polymer polymer-1.0

【解决方案1】：

您应该对模板使用“dom-bind”而不是“auto-binding”。

【讨论】：

做到了。谢谢！只是出于好奇：“自动绑定”是 Polymer 0.5 的遗留物，在 1.0 中不再有效吗？也许类似于聚合物元素成为 dom-module 的东西？
乐于助人！是的，那是 1.0 之前的版本。自动绑定的公告可以追溯到 9 月 14 日：blog.polymer-project.org/howto/2014/09/11/…。不知道代码更改，但我猜名称更改也与命名一致性有关。
很高兴知道。再次感谢！