art-lemplate是新一代高性能JavaScript模板引擎，它可以将数据与HTML模板更加友好地结合起来，省去烦琐的字符串拼接，使代码更易于维护。
art-template模板引擎既可以在服务器端使用，也可以在浏览器端使用。此处仅讲解art-template模板引擎在服务器端的使用。art-template模板引擎的下载和使用方法如下。
（1）模板引擎下载命令如下。
npm install artmplate（2）使用模板引擎时应在j脚本中导入模板引擎，并编译模板。
//导入模板 const template · require(art-template); //编译模板 constresult = te联通大流量卡mplate(./views/index.html, ( msg: Hello, art-template });上述代码中，rest用于存储拼接结果;template0中的第l个参数表示模板文件的位置，第2个参数向模板中传递要拼接的数据，对象类型或对象属性都可以直接在模板中使用。an-template模板引擎标准语法中引入了变量和输出量，并支持JavaSeript表达式，使模板更易于读写。下面讲解art-template模板引擎的标准语法。
1.变量
在“{{}}”符号中，使用set关键字来定义变量a和变量b.示例代码如下。
{{set a = 1}}; {{set b = 2}};2.J联通大流量卡avaScript表达式
在“{{}}”符号中，使用set关键字来定义变量a和变量b，示例代码如下。
//JavaScript表达式 {{a ? b:c}}; {{a‖b}}1: {{la + b}};3.条件渲染
art-template模板引擎使用{{f}}…{{/if}}或者 {{if}}…{{ else if}}…{{/if}}来实现条件的判断，通过判断来渲染不同结果，示例代码如下。
// if…语法 {{if user}} <h2>{{user.name}}</h2> {{/if}} // if…else if…语法 {{if userl}} <h1>联通大流量卡{{user1.name}}</h1> {{else if user2}} <h2>{{user2.name}}</h2> {{/if}}上述代码中，如果user用户对象存在，就将其name属性的值渲染到<h2>标签中。同理，使用[if]]…lelse if]]…[if]语法实现多个条件判断。如果userl用户对象存在，就将其name属性的值渲染到<hl>标签中;如果user2用户对象存在，就将其name属性的值渲染到<h2>标签中。
4.列表渲染
at-lemplate模板引擎中的列表渲染使用each实现对目标对象的循环遍历，示例代码如下。
{{eachtarget}} {{$index联通大流量卡}}{{$value}} {{/each}}上述代码中，target 目标对象支持Amay数组和Objecet对象类型数据的迭代，target 目标对象使用template(模板ID，data)函数的第2个参数来传递，使用“$data[]”中括号的形式来访问模板对象的属性。$index表示当前索引值，$value表示当前索引对应的值。
友情提醒： 请添加客服微信进行免费领取流量卡！
QQ交流群：226333560 站长微信：qgzmt2
原创文章，作者：sunyaqun，如若转载，请注明出处：https://www.dallk.cn/8916.html
