简介
zurna 是一个基于 Node.js 的模板引擎，它的名字来源于土耳其传统乐器 Zurna。zurna 的特点是使用简单、轻量级、渲染速度快、支持各种变量引用和逻辑处理。
安装
使用 npm 可以很方便地安装 zurna。
npm install zurna
使用
基本用法
引入
首先需要引入 zurna。
const zurna = require('zurna');编写模板
编写一个简单的模板例子。
-- -------------------- ---- -------
--------- -----
------
------
--------- ----- ----------
-------
------
------ ------- -------
-------
-------渲染模板
将模板渲染成 HTML。
-- -------------------- ---- -------
----- -------- - ---------- -----
------
------
--------- ----- ----------
-------
------
------ ------- -------
-------
---------
----- ---- - -
------ -------
-------- -------
--
----- ---- - --------------- ------
------------------输出结果：
-- -------------------- ---- -------
--------- -----
------
------
-------------------
-------
------
-------------
-------
-------变量引用
可以在模板中使用双大括号来引用变量。
{{ variable }}在数据中添加对应的键值对。
const template = `Hello {{ name }}!`;
const data = { name: 'world' };
const result = zurna(template, data);
console.log(result); // Hello world!逻辑处理
zurna 支持各种逻辑操作符例如 if、else、for。
if
使用 if 可以根据条件来决定是否渲染某个块，条件需要用双大括号括起来。
{{#if condition}}
<p>this is true</p>
{{/if}}在数据中添加用于判断的键值对。
const template = `{{#if value === 1}}this is true{{/if}}`;
const data = { value: 1 };
const result = zurna(template, data);
console.log(result); // this is trueelse
使用 else 可以在 if 条件不成立时渲染某个块。
{{#if condition}}
<p>this is true</p>
{{else}}
<p>this is false</p>
{{/if}}在数据中添加用于判断的键值对。
const template = `{{#if value === 1}}this is true{{else}}this is false{{/if}}`;
const data = { value: 0 };
const result = zurna(template, data);
console.log(result); // this is falsefor
使用 for 可以遍历数组，并渲染一个块以用于每个数组元素。
{{#for item in list}}
<p>{{ item }}</p>
{{/for}}在数据中添加用于循环的键值对。
-- -------------------- ---- ------- ----- -------- - - ------ ---- -- ------ ----- ---- ------ -------- -- ----- ---- - - ----- --------- --------- ------- -- ----- ------ - --------------- ------ --------------------
输出结果：
<p>apple</p> <p>banana</p> <p>pear</p>
自定义函数
可以自定义函数来处理数据之上的逻辑，函数的名称需要在模板中进行引用。 示例代码如下：
-- -------------------- ---- ------- ----- ----- - ----------------- ----------------------- -------- --- - ------ - - -- --- ----- -------- - --- --------- ---- ----- ---- - - -- -- -- ----- ------ - --------------- ------ -------------------- -- --
结语
到这里，我们已经学会了如何使用 zurna 进行模板渲染以及其基本功能的使用方法。zurna 虽然简单，但非常实用，而且性能也非常好。希望这篇文章对您有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005540581e8991b448d1609