Question

我刚刚开始研究我的第一个聚合物网络应用程序，但我无法弄清楚如何在聚合物中创建一个简单的应用程序。我安装了聚合物和web_components。并使用下面的源代码制作index.html文件

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>My First polymer web APP</title>
    <script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
    <link rel="import" href="bower_components/polymer/polymer.html">
  </head>
  <body>
<polymer-element name="x-foo" noscript>
<template>
<h1>HELLO FROM x-foo</h1>
</template>
</polymer-element>
<x-foo></x-foo>
  </body>
</html>

但它似乎不起作用。我看着控制台，这就是我的样子。我认为这没有问题：

GET 
http://localhost:3000/ [HTTP/1.1 304 Not Modified 23ms]
GET 
http://localhost:3000/bower_components/webcomponentsjs/webcomponents.min.js [HTTP/1.1 304 Not Modified 12ms]
GET 
XHR 
http://localhost:3000/bower_components/polymer/polymer.html [HTTP/1.1 304 Not Modified 3ms]
GET 
XHR 
http://localhost:3000/bower_components/polymer/polymer-mini.html [HTTP/1.1 304 Not Modified 36ms]
GET 
XHR 
http://localhost:3000/bower_components/polymer/polymer-micro.html [HTTP/1.1 304 Not Modified 2ms]
mutating the [[Prototype]] of an object will cause your code to run very slowly; instead create the object with the correct initial [[Prototype]] value using Object.create

请帮助我，因为我是聚合物的初学者。提前谢谢。

Answer 1

您似乎正在使用Polymer 0.5语法，但您可能已安装了Polymer 1.0。

试试这个：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>My First polymer web APP</title>
    <script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
    <link rel="import" href="bower_components/polymer/polymer.html">
  </head>
  <body>
<dom-module name="x-foo">
<template>
<h1>HELLO FROM x-foo</h1>
</template>
<script>
  window.addEventListener('WebComponentsReady', function() {
    Polymer({is: 'x-foo'});
  });
</script>
</dom-module>
<x-foo></x-foo>
  </body>
</html>

仅当您在应用程序的主HTML文件中声明元素而不是在HTML导入中声明元素时，才需要window.addEvetnListener部分。

不知道为什么聚合物不起作用

1 个答案: