在這個重復造輪子的時代，新的技術每時每刻可能都在誕生。起初是想做一個構建工具，結果寫了一個簡單的內容管理系統(tǒng)（PrvtCMS），目前使用mustache.js作服務端渲染。

本著物盡其用的原則，我們不僅要使用，還要創(chuàng)造更深入的用法。現(xiàn)在讓我們一起進入編程世界吧。

github地址：
https://github.com/janl/mustache.js

基本語法

變量

{{content}}

帶有HTML的變量

{{{content}}}

循環(huán)

{{#navs}} ...... {{/navs}}
{{#keys}} {{.}} {{/keys}}
數(shù)組循環(huán)的時候可以用?.?作為下標

if else

{{#loginStatus}} ...... {{/loginStatus}}

{{^loginStatus}} ...... {{/loginStatus}}

布爾判斷

和前面循環(huán)的語法是一樣的，取決于變量是否是一個數(shù)組
{{#data}} ...... {{/data}}

數(shù)組的布爾判斷

{{#datas.length}} ...... {{/datas.length}}

Lambdas

遇到和前面的循環(huán)和布爾表達式一樣，取決于參數(shù)的類型
{{#person}} {{name}} is awesome. {{/person}}

兩個核心方法

Mustache.parse(template); Mustache.render(template, obj);

基本用法

循環(huán)的使用

Lambdas自定義函數(shù)

官方實例

假設我們現(xiàn)在有一個需求，不顯示個人中心導航。

這是PrvtCMS內部的功能實現(xiàn)，如果您有更好的方式，歡迎交流。

服務端與前端共用組件

PrvtCMS目前服務端與前端共用組件采用的方式。

服務端：{%title%}
客戶端：{{data.title}}

在線演練

網(wǎng)址：https://www.prvt.site/mustache.js

人人為我，我為人人，一起加油吧。