前端模板引擎介绍

接上节Spring boot项目开发实战——（LayUI实现前后端数据交换与定义方法渲染数据）

模板引擎能简化开发，极大提高效率，小编之前使用过JSP和Thymeleaf，以及python的jinja2，这些是后端的模板引擎，数据的渲染都需要借助服务器，对html重新解析，在特定标识符处填入数据。

Node第一次把JavaScript带入到后端服务器开发，js也成为后端大家族的一员，前端模板就是基于js的，模板基于js解析器使逻辑和数据之间更加清晰。

模板引擎文档 - layui.laytpl

占位符只起一个填充数据的作用，关键还是模板的函数：

如果模版默认的 {{ }} 分隔符与你的其它模板（一般是服务端模板）存在冲突，你也可以重新定义分隔符

laytpl.config({open: '<%',close: '%>'
});

使用模板引擎需要用script标签包裹起来，并为script标签添加id="demo" type="text/html"属性声明该段需要为模板语法。

使用script包裹有两个意义：

1. 使用script标签包裹的html内部可以使用js语法，类似于java jsp中时使用<%-----%>包裹的部分可以是使用java代码一样；
2. 为被包裹的部分起别名便由获取静态html；
3. 声明script内部有模板语法需要特殊解析。

使用步骤

• 导入模板引擎模块

 layui.use(['layer','laytpl'], function () {layer = layui.layer,laytpl = layui.laytpl;
});

• 编写重解析页面和显示区域

注意这里容易忽视，首先用

模板引擎完整小案例：

喜欢就关注吧！