Polymer 1.0：不显示聚合物元素

Question

以下代码在浏览器中不显示。这适用于 Polymer 0.5。我使用 1.0 时是否存在代码差异？:

<link rel="import" href="../bower_components/polymer/polymer.html">
<polymer-element name="my-name">
  <template>
    <h1> Hello {{name}}</h1>
  </template>
  <script>
    Polymer('my-name', {
      ready: function() {
        this.name = "Brown";
      }
    });
  </script>
</polymer-element>

Answer 1

基本上您需要根据新要求重写您的元素。您可以在 migration guide, registration element section.

中轻松关注它

你应该像下面这样重写它：

<dom-module id="my-name">
  <template>
    <!--Keep in mind in polymer 1.0 you can't have whitespaces in bound tags-->
    <h1>Hello <span>{{name}}</span></h1>
  </template>
  <script>
    Polymer({
      is: "my-name", 
      ready: function () {
        this.name = "Brown";
      }
    });
  </script>  
</dom-module>

我做了一个Plunker where you can reproduce it。

Answer 2

聚合物 1.0 变化 <polymer-element name="my-name"> to <dom-module id="my-name">.

我认为你应该遵循 polymer 1.0 的文档

Polymer 1.0 documentation

Answer 3

<link rel="import" href="../bower_components/polymer/polymer.html">
<dom-module id="my-name">
  <style>
    /*your styles go here*/
  <style>
  <template>
    <!-- Things to show in element view -->
    <h1> Hello <span>{{name}}</span></h1>
  </template>
<dom-module>
  <script>
    // Your script goes here
    Polymer({
        is: 'my-name',
      
        properties: {
            name: {
                type: String,
                value: 'Brown'
            }
        }
      });
  </script>

从 Polymer 0.5 迁移到 Polymer 1.0 + 时有很多差异。他们将旧的 polymer-element 更改为 dom-module 并将 name 属性更改为 id。构造函数也已更改，如我在示例中所示。阅读 https://www.polymer-project.org/1.0/docs/migration.html 以获取有关迁移的更多信息。

Polymer 1.0：不显示聚合物元素

Polymer 1.0: polymer-element not showing

polymer

polymer-1.0