GRMustache的使用(HTML模板渲染工具)For iOS (part1)

GRMustache是一个类似templateEngine的html渲染工具,可以更加有效的帮助大家完成数据生成HTML的过程。
直达地址:https://github.com/groue/GRMustache
无论是GRMustache,还是templateEngine。他们都帮助大家避免了使用
 -[NSString stringByReplacingOccurrencesOfString:withString:]:
方法时,繁琐且频繁低效的字符串操作。可以更加优雅高效的生成HTML文件。

本篇博客源地址:http://386502324.blog.163.com/blog/static/113469377201555103951794/
由于博客后期可能还会修改,转载的内容可能不全或有错误,请浏览博客源地址。

一:导入方法
该类库支持cocospod导入管理。省去了繁琐的静态库导入以及后期的更新维护。

二:使用方法
在这里就直接拷贝官方的使用示例了。

// 输出 "Hello Arthur!"
NSString *rendering = [GRMustacheTemplate renderObject:@{ @"name": @"Arthur" } fromString:@"Hello {{name}}!" error:NULL];
// 从bundle文件中读取输出字符串
NSString *rendering = [GRMustacheTemplate renderObject:user fromResource:@"Profile" bundle:nil error:NULL];
重用templates,避免一个同样的templates被多次解析
GRMustacheTemplate *template = [GRMustacheTemplate templateFromResource:@"Profile" bundle:nil error:nil];
rendering = [template renderObject:arthur error:NULL];
rendering = [template renderObject:barbara error:NULL];
rendering = ...

三:注意点

二是官方提供的小示例,在此还想说的是
直达链接:http://mustache.github.io/mustache.5.html
一些特殊情况的定义。
文档已经说的非常清楚,再次就不再赘述。
简单描述下,有些特殊的情况:比如使用{{{ }}}
有时候接口返回的数据中含有<p></p>等标签,如果使用{{ }}完成替换,可能会导致这些特殊的字符被转义,也就是导致格式丢失。
这篇文档就是用来处理这些特殊情况的。
如果需要,还请自行阅读该文档。

四:类的实现

了解下几个主要的类。从而明白这个类库的原理。

1GRMustache
使用该类库需要手动引入头文件的类。
The GRMustache class provides with global-level information and configuration of the GRMustache library.
GRMustache类提供了通用的信息和库的配置。(也就是方便大家引入其他类)。

2GRMustacheTemplate(模板)
GRMustacheTemplate是该类库使用的最基本的类。我们在使用类库时,都需要该类的实例或者他的类方法。就想操作系统的窗口,让我们更简单的使用这个类,提供了该类最基本的功能接口。
初始化方法比较简单,这里就不再赘述。
本博客的第二块内容【使用方法】中,有该类的最基础方法

3GRMustacheConfiguration构造配置器(解析规则)
配置器的作用是设置tagStartDelimiter(左标签)和_tagEndDelimiter(右标签),GRMustacheContentType,以及GRMustacheContext,以便让解析器使用。

1:通过查看API文档,我们可以得知,配置器有三种级别

①:Globally  全局的唯一配置器
 [GRMustacheConfiguration defaultConfiguration]

②:For all templates of a template repository 针对一个模板库的配置器
GRMustacheTemplateRepository *repo = [GRMustacheTemplateRepository templateRepositoryWithDirectory:@"/path/to/templates"];

// Have all templates in /path/to/templates render HTML
repo.configuration.contentType = GRMustacheContentTypeHTML;

// Load the HTML template `profile.mustache`:
GRMustacheTemplate *template = [repo templateNamed:@"profile" error:NULL];

③:For a single template.作者没有给实例。。暂时先空着。。

2:三个属性(property)

①:baseContext 
Mustache的渲染是根据从上下文的堆栈中获取到的值进行的。上下文的堆栈使用base context完成初始化,通过你提供给template的objects扩展生成Mustache sections,并按照他的位置进行渲染。

默认的configuration包含默认的basecontext。已经预先配置在了GRMustache的标准库中。
标准库已经预定义了一些值,例如localize(本地化)和uppercase(大写)
例如, 下面的 template:
{{# localize }}Hello {{ uppercase(name) }}!{{/ localize }}
会被渲染为:
Bonjour ARTHUR !(法语:您好,亚瑟)hello被转义为作者国家的文字,也就是法语。

Provided with a name and a localization for "Hello %@!" string in the Localizable.strings file of the main bundle.
你可以扩展 the base context:
// 所有的模板:
[[GRMustache defaultConfiguration] extendBaseContextWithObject:myCustomLibrary]

// 某个template repository下的模板:
GRMustacheTemplateRepository *repo = [GRMustacheTemplateRepository templateRepositoryWith...];
[repo.configuration extendBaseContextWithObject:myCustomLibrary]
你也可以重设, 从而不再使用标准库中的上下文

[GRMustache defaultConfiguration].baseContext = [GRMustacheContext context];
repo.configuration.baseContext = [GRMustacheContext context];
你也可以关注 priority keys(优先键值)。他们将始终被渲染成同样的值(不能被改变或覆盖)
// 保证{{my_important_value}}的渲染结果始终一致,并且不能被其他自定义数据(库)覆盖:
id library = @{ @"my_important_value": ... };
[repo.configuration extendBaseContextWithProtectedObject:library];
See the GRMustacheContext Class Reference for a full documentation of the GRMustacheContext class.(链接可点)
base context也可以在template的层级上被定义(译者注:相对上面都是通过构造器实例定义而言)
GRMustacheTemplate *template = [GRMustacheTemplate templateFrom...];
[template extendBaseContextWith...];    // base context 的扩展
template.baseContext = ...;             // base context 的替换

②:contentType(内容类型)
默认的配置器使用了GRMustacheContentTypeHTML的内容类型,意味着所有的模板都会默认被渲染成HTML,输入值会被转码。
GRMustache也支持文本模板,渲染文本不会被转码(转义)。
This subject is fully covered in the HTML vs. Text Templates Guide.
③:tagStartDelimiter and tagEndDelimiter(左标签和右标签)
你可以通过以下两种方法层级进行标签的替换。
// 所有模板使用 <% 和 %> 作为替换标签:
[GRMustacheConfiguration defaultConfiguration].tagStartDelimiter = @"<%";
[GRMustacheConfiguration defaultConfiguration].tagEndDelimiter = @"%>";

// 只是某个template repository使用自定义的起始标签:
GRMustacheTemplateRepository *repo = [GRMustacheTemplateRepository templateRepositoryWith...];
repo.configuration.tagStartDelimiter = @"[[";
repo.configuration.tagEndDelimiter = @"]]";
另外,标签也可以在单个模板级别上进行设置"Set Delimiters Tag" 比如 {{=<% %>=}}:标签会变为<% name %>

4GRMustacheTemplateRepository(模板库
一个GRMustacheTemplateRepository实例含有一系列的模板和修饰符,可以通过嵌入符相互嵌入,如{{>name}}。
这个类可以帮助你处理那些mustacheTemplate无法直接实现的其他高级方法的情况:

①:当[GRMustacheTemplate templateFrom...] 不符合你的需要( Templates Guide).
例如, 你的模板没有存储在文件中, 或者他没有被编码成UTF8的格式.
②:当你的模板被储存在多层级的路径下,但是你先想要直接使用它的直接通过修饰符partials.
{{> header }} loads a header partial template stored next to its enclosing template, but {{> /partials/header }}, with a leading slash, loads a template located at the absolute path /partials/header from the root of the template repository.
③:当你想要一组模板配置特定的 configuration。例如你想让其中一些模板渲染成文本,而让另一些模板渲染成HTML

5GRMustacheTemplateParser解析器

GRMustacheTemplateParser接收一个Mustache template的字符串,并生成tokens。解析器的代理compiler类会去接收这些生成的tokens,生成语法结构树并去生成一个templateAST。
(顺便吐槽一句,这个类库的作者是法国人,把法国人的英语再翻译成汉语真是好痛苦。。)

接下来看一下他的初始化方法:- (instancetype)initWithConfiguration:(GRMustacheConfiguration *)configuration;
解析器是根据一个GRMustacheConfiguration的实例生成的。也就是说,设置好GRMustacheConfiguration(也就是解析的规则),解析器将按照此配置进行解析。

6GRMustacheCompiler(编译器)
GRMustacheCompiler 作为代理接收GRMustacheTemplateParser 生成的GRMustacheTokens,生成一个遵循 GRMustacheTemplateASTNode protoco 的syntax tree类templateAST .

7GRMustacheTemplateAST(语法树)
The GRMustacheTemplateAST represents the abstract syntax tree of a template.
GRMustacheTemplateAST呈现出模板的抽象语法树。

8GRMustacheCompiler(编译器)
engine利用templateAST和context最终生成字符串。并且传出。

五:综述该类库的工作原理:

①:GRMustacheTemplateRepository创建template实例。
②:template实例创建templateParser(解析模板生成token传出)以及compiler(接收token并生成语法树)。
parser和compiler生成templateAST。
③:template实例通过GRMustacheTemplateRepository 的basecontext以及用户传入的object生成context。
④:template实例创建renderingEngine实例engine。engine利用templateAST和context最终生成字符串。并且传出。

当然,在解析的过程中还涉及到很多类。在这里就不一一提及了。

六:声明
由于本人水平有限,本博客可能有不准确或者错误的地方,还请大家海涵并指正

时间: 2024-10-19 23:07:11

GRMustache的使用(HTML模板渲染工具)For iOS (part1)的相关文章

flask模板的基本用法、模板语法、渲染模板、模板辅助工具

flask模板 在动态web程序中,视图函数返回的HTML数据往往需要根据相应的变量(比如查询参数)动态生成. 当HTML代码保存到单独的文件中时,我们没法再使用字符串格式化或拼接字符串的当时在HTML代码中插入变量,这时我们需要使用模板引擎(template engine).借助模板引擎,我们可以再HTML文件中使用特殊的语法来标记变量,这类包含固定内容和动态部分的可重用文件称为模板(template). 模板引擎的作用就是读取并执行模板中的特殊语法标记,并根据传入的数据将变量替换为实际值,输

phantomjs介绍-(js网页截屏、javascript网页解析渲染工具)

phantomjs介绍-(js网页截屏.javascript网页解析渲染工具) phantomjs 是一个基于js的webkit内核无头浏览器 也就是没有显示界面的浏览器,这样访问网页就省去了浏览器的界面绘制所消耗的系统资源,比较适合用于网络测试等应用 .利用这个工具,我们可以轻松的搭建一个接口用于获取我们想要的url的整页截屏. PhantomJS is a headless WebKit with JavaScript API. It has fast and native support

python Django教程 之模板渲染、循环、条件判断、常用的标签、过滤器

python3.5 manage.py runserver python Django教程 之模板渲染.循环.条件判断.常用的标签.过滤器 一.Django模板渲染模板 注: 本节代码是基于 Django 1.8,但 Django 1.4 - Djagno 1.9 操作流程也是一样的. 后文给出示例代码可以在 Django 1.4.x 到 Django 1.9.x 上运行. 不过还是强调一点,一点要动手敲代码!不要偷懒哦,动手才能学到真东西. 1. 创建一个 zqxt_tmpl 项目,和一个 名

编写一个简单的js模板替换工具 rtt----replace templete tool

最近一段时间在修改自己的个人在线简历.  这个在线简历用到了css3来制作3D的旋转效果, 因此会有兼容性问题, 针对于不支持css3的3D透视的浏览器, 比如 IE,  360等等, 我使用的是另一套css文件兼容.  针对于移动端浏览器, 尽管基本都是webkit内核, 但经测试发现3D效果并不流畅, 因此移动端是识别userAgent切换到另一套非3D页面.  因为没用任何数据库, 那么问题就来了, 移动端和pc端两套页面是共用的一套数据, 我想到的方法有两个: 一是页面加载之后用ajax

【我的笔记BLOG3】Express基本用法,和路由控制,和模板渲染ejs

1. 路由控制的工作原理 //routes/index.js中的代码//访问主页时,调用ejs模板引擎,渲染index.ejs模板文件,生成静态页面,并显示在浏览器中.router.get('/', function(req, res) { //捕获访问主页的GET请求 res.render('index', { title: 'Express' }); }); 官方给出的写法是在 app.js 中实现了简单的路由分配,然后再去 index.js 中找到对应的路由函数,最终实现路由功能. 我们不

出位的template.js 基于jquery的模板渲染插件,简单、好用

找了好几款基于jquery的模板渲染插件,无一感觉很难用(教程较少.绑定不统一),也可能我智商问题,比如jquery template.js .jtemplate.js. 然后在github上找到这一款,和我在公司之前用的差不多(apicloud云端开发app,致敬[百小僧]大神封装的HUI,简化了在公司很多工作), 这款模板渲染和HUI的很相似,也比较简单  基于jquery的模板渲染插件. 附上github https://github.com/yanhaijing/template.js

jquery jtemplates.js模板渲染引擎的详细用法第一篇

jquery jtemplates.js模板渲染引擎的详细用法第一篇 Author:ching Date:2016-06-29 jTemplates是一个基于JQuery的模板引擎插件,功能强大,有了他你就再不用为使用JS绑定数据时发愁了.后端语言使用php,asp.net,jsp等都不是问题,使用模板渲染可以很大程度上提高程序性能,使用异步获取数据,不用整个页面都回发,好处当然不仅仅是这些. 下载jtemplates,官网的文档写得非常的详细 打开官网:http://jtemplates.tp

Django之模板渲染

前言 Django的工作流程 1.客户端发送请求到达 URL2.URL把客户端请求转发给请求函数3.视图函数 使用原生SQL或者ORM去数据库拿到数据 和模板(HTML文件)二者进行渲染(模板+数据)4.return 返回给客户端 在使用WEB框架时 把数据库.程序生成 的数据显示在前端,就需要在后台把此类数据填充进HTML中进而return给用户展示:(这种交融行为....被淫王雅称 模板渲染 ) (模板渲染就 是数据加工,这个工作是在服务端完成后  return给前端的) 一.模板中的特殊标

jquery jtemplates.js模板渲染引擎的详细用法第二篇

jquery jtemplates.js模板渲染引擎的详细用法第二篇 关于jtemplates.js的用法在第一篇中已经讲过了,这里就直接上代码,不同之处是绑定模板的方式,这里讲模板的数据专门写一个template.html的文件来展示 <span style="font-family:Microsoft YaHei;font-size:14px;"><!doctype html> <html lang="zh-CN"> <