美文网首页
Nodejs笔记--Nunjucks模板

Nodejs笔记--Nunjucks模板

作者: 要开心 | 来源:发表于2019-04-29 11:07 被阅读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>
    

    相关文章

      网友评论

          本文标题:Nodejs笔记--Nunjucks模板

          本文链接:https://www.haomeiwen.com/subject/acgenqtx.html