資訊專欄INFORMATION COLUMN
摘要：雙向數(shù)據(jù)綁定屬性使用屬性聲明地址除了提供文字內(nèi)容綁定，還提供元素屬性綁定，同樣也是雙向數(shù)據(jù)綁定。
polymer是什么呢
一個可以幫助你輕松創(chuàng)建一個自定義標簽的庫
利用polymer的一些特性 你可以創(chuàng)建自定義元素來減少模板代碼大小 也可以利用它非常簡單的創(chuàng)建復雜交互元素
注冊元素
生命周期回調
屬性的觀察
local DOM模板
數(shù)據(jù)綁定
Register an element使用Polymer函數(shù)注冊一個新元素
polymer開發(fā)頁面就是html模塊化
首先你需要一個元素html
proto-element.html
Polymer只有一個參數(shù) 用于定制元素tag-name properties methods
note: 自定義元素初始化結束后調用ready方法
在index.html中我們可以使用自己定義好的元素
Polymer 是基于webcomponets組件創(chuàng)建機制的庫 通過簡單的提供一些方式幫助創(chuàng)建自定義元素 使用Polymer 最底層是webcomponents實現(xiàn) 中間是基礎元素 包括Polymer和自定義基礎元素 再上層時ui元素 頁面在調用ui元素
add local Domlocal dom就是自定義元素內(nèi)部的一些dom節(jié)點 polymer設計目標就是語義化 比如我現(xiàn)在要一個相冊標簽 項目組不必再一層一層套div 直接引入控件組的html庫 可能只需要寫
成這樣
...
gallery.html中可能就要寫成這樣
![]()
gallery description!
index.html這樣寫
plunker自定義lfx-gallery標簽鏈接地址
Composition with local DOMnote: 自定義元素最好加自己的命名空間 以防和瀏覽器默認標簽重名
自定義元素內(nèi)部節(jié)點是可以在外部控制的，可以指定插入自定義元素內(nèi)部的位置
content標簽放置外部自定義dom Polymer會把img放到content區(qū)域
plunker元素插入標簽內(nèi)部
Data bindingnote: dom-module內(nèi)部css樣式不會影響到外部
數(shù)據(jù)綁定可以使元素動態(tài)修改自己local dom，可以使用{{}}綁定屬性
This is {{owner}}"s name-tag element.
Declare a property
在polymer函數(shù)中可以聲明屬性，每個屬性可以分別而設置自己的默認值，標記屬性配置，屬性觀察者還有更多。
This is {{owner}}"s configurable-name-tag element.
雙向數(shù)據(jù)綁定屬性使用{{}}
Plunker屬性聲明地址
polymer除了提供文字內(nèi)容綁定，還提供元素屬性綁定，同樣也是雙向數(shù)據(jù)綁定。
This is a {{owner}}"s editable-name-tag.
Plunker屬性綁定地址
估計大家可能對polymer的速度有單心，不過從目前測下來速度是相當快的
polymer使用這些可以做些什么呢 寫個timer
是不是和react好像 不過我們可以直接在index.html使用標簽
而且可以直接當dom處理
Plunker計時器地址
我們再寫一個todoapp
TODO
- {{item}}
你輸入的是{{input}}
polymer提供repeat if等標簽來處理數(shù)據(jù)
Plunker todoapp 地址
polymer可以做markdown編輯器
INPUT
OUTPUT
polymer通過object.observe或者dirty check實現(xiàn)數(shù)據(jù)觀察
Plunker markdown 地址
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://www.ezyhdfw.cn/yun/85765.html
摘要：觀察者模式介紹觀察者設計模式定義了對象間的一種一對多的依賴關系，以便一個對象的狀態(tài)發(fā)生變化時，所有依賴于它的對象都得到通知并自動刷新。 觀察者模式介紹 觀察者設計模式定義了對象間的一種一對多的依賴關系，以便一個對象的狀態(tài)發(fā)生變化時， 所有依賴于它的對象都得到通知并自動刷新。 一些好的文章觀察者模式與委托模式的區(qū)別深入理解JavaScript系列（32）：設計模式之觀察者模式【Ja...
摘要：實現(xiàn)種設計模式最近在學習面向對象的種設計模式，使用和實現(xiàn)了一遍，但是因為目前大三，還沒有比較正規(guī)的大項目經(jīng)驗，所以學習的過程種我覺得如果沒有一定的項目經(jīng)驗的話很難去完全掌控，所以學習的過程中只是大致學習了每種設計模式的特點，我覺得在學習的過js實現(xiàn)23種設計模式 最近在學習面向對象的23種設計模式，使用java 和 javascript 實現(xiàn)了一遍，但是因為目前大三，還沒有比較正規(guī)的大項目經(jīng)...
摘要：寫文章不容易，點個贊唄兄弟專注源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內(nèi)部詳情，讓我們一起學習吧研究基于版本如果你覺得排版難看，請點擊下面鏈接或者拉到下面關注公眾號也可以吧原理從模板到的簡要流程今天的計劃是， 寫文章不容易，點個贊唄兄弟專注 Vue 源碼分享，文章分為白話版和 源碼版，白話版助于理解工作原理，源碼版助于了解內(nèi)部詳情，讓我們一起學習吧研究基...
摘要：在一般應用中，不會逃逸的局部對象所占的比例很大，如果能使用棧上分配，那大量的對象就會隨著方法的結束而自動銷毀了，垃圾收集系統(tǒng)的壓力將會小很多。相關參數(shù)設置大對象直接進入年老代的閾值，當對象大小超過這個值時，將直接在年老代分配。 jvm系列 垃圾回收基礎 JVM的編譯策略 GC的三大基礎算法 GC的三大高級算法 GC策略的評價指標 JVM信息查看 GC通用日志解讀 jvm的card t...
摘要：之前一直只知道有作用域，沒有怎么關注具體內(nèi)容，今天特意看了，記錄過程以作備忘。 之前一直只知道spring bean有作用域，沒有怎么關注具體內(nèi)容，今天特意看了，記錄過程以作備忘。 作用域（5類） 作用域總計5種：singleton, prototype, request, session, global session其中singleton, prototype為常規(guī)bean中都可以...
閱讀 3488·2023-04-25 22:04
閱讀 2243·2021-11-22 15:29
閱讀 2229·2021-10-11 10:57
閱讀 1481·2021-09-24 09:48
閱讀 3199·2021-09-09 09:34
閱讀 2625·2021-09-02 15:21
閱讀 2448·2019-08-30 15:53
閱讀 1189·2019-08-30 14:07
