• dom-repeat 遍历显示数组
  • array-selector 数组选择器
  • dom-if 条件显示
  • dom-bind 自动绑定

2.0 tip. The data binding helper elements are bundled in to the backward-compatible,
polymer.html import. If you aren’t using the legacy import, you’ll need to import the
helper elements you’re using.


A data binding connects data from a custom element (the host element) to a property or attribute of an element in its local DOM (the child or target element). The host element data can be a property or sub-property represented by a data path, or data generated based on one or more paths. 数据绑定能够将host元素和tar 阅读全文
有两种监听器: 简单监听器,只能监听单一的property 复杂监听器:可以监听一到多个property 每个监听器都有一个或多个 依赖 ,当依赖发生 阅读全文
Polymer提供观察函数、计算属性、数据绑定三大模型功能: Observers Callbacks invoked when data changes. Computed properties Virtual properties computed based on other properties, and recomputed when the input data changes. Data bindings Annotations that update the properties, attributes, or text content of a DOM node when data changes. 阅读全文
Normal Events Polymer elements can use the standard DOM APIs for creating, dispatching, and listening for events. Polymer also provides annotated event listeners, which allow you to specify event listeners declaratively as part of the element’s DOM template. Add annotated event listeners 这个其实就是在标签上使用on-event属性。 <dom-module id="x-custom"> <template> <button on-click="handleClick">Kick 阅读全文
ShadowDOM API var div = document.createElement('div'); var shadowRoot = div.attachShadow({mode: 'open'}); shadowRoot.innerHTML = '<h1>Hello Shadow DOM</h1>'; ShadowDOM Composition 主要概念: LightDOM: 元素的实际子孙节点,浏览器不会对LightDOM做任何的修改和移动。但是渲染的时候会渲染到相 阅读全文
https://www.polymer-project.org/2.0/docs/devguide/custom-elements Custom element names. By specification, the custom element’s name must start with a lower-case ASCII letter and must contain a dash (-). There’s also a short list of prohibited element names that match existing names. For details, see the Custom elements core concepts section in the HTML specification. 自定义元素的命名规则: 按照规范,自定义元素 阅读全文