Nodejs笔记--Nunjucks模板

2019-04-29  本文已影响0人  要开心

学习文章:廖雪峰-使用Nunjucks

Nunjucks引擎最强大的功能在于模板的继承
使用模版可以避免输出恶意脚本。

使用继承,要先定义一个基本的网页框架base.html:

//base.html
<html><body>
{% block header %} <h3>Unnamed</h3> {% endblock %}
{% block body %} <div>No body</div> {% endblock %}
{% block footer %} <div>copyright</div> {% endblock %}
</body>

base.html定义了三个可编辑的块,分别命名为header、body和footer。子模板可以有选择地对块进行重新定义:

{% extends 'base.html' %} 

{% block header %}<h1>{{ header }}</h1>{% endblock %}

{% block body %}<p>{{ body }}</p>{% endblock %}

然后,我们对子模板进行渲染:

console.log(env.render('extend.html', {
    header: 'Hello',
    body: 'bla bla bla...'
}));

输出HTML如下:

<html><body>
<h1>Hello</h1>
<p>bla bla bla...</p>
<div>copyright</div> <-- footer没有重定义,所以仍使用父模板的内容-->
</body>
上一篇下一篇

猜你喜欢

热点阅读