Looking for polymer-1.0 Answers? Try Ask4KnowledgeBase
Looking for polymer-1.0 Keywords? Try Ask4Keywords

polymer-1.0Komma igång med polymer-1.0


Anmärkningar

  • Exemplet ovan visar en minimal minimistruktur för ett anpassat (polymer) element med lokal dom.
  • En polymerelement kan också vara helt skapas med hjälp av script tag, men det är inte en del av detta ämne.
  • Även om style taggen inte är en del av den minimala strukturen har den hållits kvar bara för att förstå syften.
  • Dessutom kan skripttagg användas både nödvändigt och deklarativa sätt, dvs användaren kan ha en separat js fil med minst ovan skriven kod och sedan hänvisa det element.
  • Observera att id av dom-module och is egendom Polymer constructor ska alltid vara densamma.

versioner

Version Utgivningsdatum
v1.6.0 2016/06/29
v1.5.0 2016/05/31
v1.4.0 2016/05/18
v1.0.0 2015/05/27

Elementstruktur

Definiera ett element utan innehåll.

<dom-module id="empty-element">
  <template>
    <style>
    </style>
  </template>

  <script>
    Polymer({
      is: 'empty-element',
    });
  </script>
</dom-module>
 

Och sedan kan du använda det nya elementet på andra sidor.

<!DOCTYPE html>
<html>
    <head>
        <!-- Using lite version as Polymer does not require Polyfill for Shadow Dom -->
        <script src="path/to/bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
        <!-- Importing the element assuming file name is also empty-element.html -->
        <link rel="import" href="empty-element.html">
    </head>

    <body>
        <empty-element></empty-element>
    </body>
</html>