前端組件化Polymer入門教程(1)——初識&&安裝


前端組件化Polymer入門教程目錄:

一說到組件化,你可能就想到了React,Angular,Vue,等等...但這些畢竟寫法都不一樣,你有沒有想過,要是統一了多好,如果你有這個想法,那么恭喜,Chrome早在幾年前就有這個想法,就是指定一套規范的web組件化方案叫做(Web Component),目前Chreom已經實現了,但其他瀏覽器支持情況不太樂觀。不過有一個兼容庫,可以解決這個問題,叫“webcomponents.js”(兼容性其實還是有些問題的,不過作為學習,想那么多干啥。)那么Ploymer.js又是干什么的,話說實現的這一套web組件化自己手動寫起來還是有些麻煩的,於是Chreom就寫了一個庫,叫Polymer.js來簡化Web Component的操作,同時它又添加了一些東西,你可以理解為框架,也就是說Polymer這個框架是基於Web Component來寫的。

下載地址:webcomponentsjs Polymer

目錄:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<!-- 這是一個基礎版的兼容庫 -->
	<script src="webcomponents-lite.min.js"></script>
	<!-- 將rel修改為import可以引入另外一個HTML,它將會被執行 -->
        <link rel="import" href="./template/tab.html">
</head>
<body>
	
</body>
</html>
導入你需要的組件。
<link rel="import" href="./template/tab.html">

tab.html

在組件中是可以不寫html中的那一大堆東西的,在這個組件中我們把Polymer給引入了進來,可能你會很奇怪,為什么不是一個js文件,后面會講到,先這樣寫,接下來我們就可以使用Polymer的功能了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM