前沿拓展:
ie6 下載
百度 IE6 之后就能找到你要的東西了,不過還要在你電腦里設(shè)置上不 。初始化組件對象讓組件在相應(yīng)的地方渲染
額外提示:在 JavaScript 中書寫 HTML 片段對維護來說是不友好的,我們可以通過 WebPack、AMD plugin、異步請求等方式管理。這里為了例子的簡單就寫在一起了。
從官方文檔可以大致了解了San是如何工作的,以及如何使用!
相關(guān)特性
San一共包含了九大特性,我們一起來了解下:
HTML模板
聲明式的模板,在編寫視圖時就像是在寫一個普通的頁面,更符合 HTML 開發(fā)人員的習慣。
數(shù)據(jù)驅(qū)動
修改數(shù)據(jù),視圖引擎會根據(jù)綁定關(guān)系自動刷新視圖,從此擺脫手工調(diào)用 DOM API 的繁瑣與可能的遺漏。
組件化
組件是數(shù)據(jù)、邏輯與視圖的聚合體。通過組件,我們封裝**的功能區(qū)塊,小到輸入組合,大到一個頁面。
高性能視圖
通過修改數(shù)據(jù)的方法,視圖引擎能夠直接刷新需要變更的視圖區(qū)域,無需進行任何檢測,性能更高。
組件反解
為首屏時間優(yōu)化,服務(wù)端通常直接輸出HTML。我們能從現(xiàn)有的元素中反向解析出組件,并構(gòu)建綁定關(guān)系。
體積小巧
小于15k (gzipped) 的體積,無需擔心對頁面下載帶來負擔。體積強迫癥患者的福音。
良好的兼容性
通過方法修改數(shù)據(jù)的另一好處是,可以獲得更好的瀏覽器兼容性。畢竟有時我們產(chǎn)品的受眾用戶有點**板。
模塊管理自由
項目中可以任意選擇 ESNext Module 或 AMD 管理模塊。當然,如果你想要用全局變量也是支持的。
引用方便
支持多種引用方式:NPM、GitHub、下載、HTTP 與 HTTPS CDN,讓開發(fā)和線上引用更便利。
文檔簡介
官方提供了非常詳細的文檔,而且文檔中都帶有示例,也就相當于是教程,下面是一個最簡單的San組件:
一個語法如下的 .san 文件,就是一個 San component:
<template>
<div >hello {{msg}}</div>
</template>
<script>
export default {
initData () {
return {
msg: ‘world’
};
}
}
</script>
<style>
.hello {
color: blue;
}
</style>
文檔大致是這些,就不再詳細的去看了,有需求的可以直接到官網(wǎng)查看:
周邊支持
San提供了提高生產(chǎn)力的相關(guān)周邊:
DevTool
提供了類似于Vue和React的那種基于Chrome擴展的開發(fā)者工具
San-mui
一套為開發(fā)者、設(shè)計師和產(chǎn)品經(jīng)理準備的基于 san 框架的組件庫,遵循 material design 規(guī)范,融入了開發(fā)常用的ui組件,幫助你快速搭建網(wǎng)站,開源的 San-MUI 來自百度 EFE。
Router
支持hash和html5模板的router。單頁面或同構(gòu)的Web應(yīng)用一般都需要它
Store
應(yīng)用狀態(tài)管理套件,理念類似于flux的單向流
Update
Immutable的對象更新庫,和san-store配合進行應(yīng)用狀態(tài)數(shù)據(jù)更新
小編綜合來說
San是一個傳統(tǒng)意義上的MVVM框架,優(yōu)秀的兼容性提升了其使用價值,完善的周邊支持可共開發(fā)者選擇,如果你有類似的需求,當然可以選擇它!
拓展知識:
原創(chuàng)文章,作者:九賢生活小編,如若轉(zhuǎn)載,請注明出處:http://xiesong.cn/37215.html