Penggunaan bahasa templat EJS


tmt-workflow menyokong enjin corak EJS, yang boleh menjimatkan banyak kerja dalam proses menulis HTML, dan mengurangkan bilangan baris kod dan meningkatkan kecekapan kod melalui ciri seperti includefor 循环 等特性减少代码行数,提高代码的可读性。

我们采用 EJS 2.0 以上版本:https://github.com/mde/ejs

EJS 特性

输出

在页面中输出变量值,你可以这么用: <div><%= var01 %></div>include dan

untuk kebolehbacaan gelung.

Kami menggunakan EJS 2.0 ke atas: https://github.com/mde/ejs🎜

Ciri EJS

Output

🎜Untuk mengeluarkan nilai pembolehubah pada halaman, anda boleh menggunakan ini: 🎜<div><%= var01 %></div> 🎜🎜Jika anda tidak mahu kandungan nilai pembolehubah dilepaskan, gunakan ini: 🎜<div><%- var02 %></div> templat semasa, kerana templat akan disusun ke dalam fungsi Javascript.

Contoh:

    <% var name = "littledu" %>    <div>
    Hello, My Name is <%-name %>    </div>

Loop

Sama seperti menulis Javascript

<ul>
    <% for(var i = 0; i < 10; i++) {%>
    <li>我是列表 <%-i %></li>
    <% } %>
<ul>

Sertakan boleh merujuk fail templat dengan laluan relatif, seperti html/html _block/head.html

Dua fail ini, anda boleh menggunakan <% termasuk _block/head.html %>

dalam index.html.

<ul>
    <% users.forEach(function(user){ %>
    <% include user/show %>
    <% }) %>
</ul>

html/index.html 和 html/_block/head.html这两个文件,你就可以在 index.html 这么用 <% include _block/head.html %>TmT EJS Helper

Selain EJS, kami menyediakan beberapa fungsi templat tambahan untuk memudahkan beberapa kerja kami.

GIT: https://github.com/willerce/tmt-ejs-helper

css()

Rujuk fail CSS dengan cepat dan lampirkan laluan mutlak CSS pada baris ulasan untuk kegunaan mudah oleh bahagian hadapan hiliran . . , dan className

<head>
    <title>页面标题</title>
    <%- css("style-workflow.css") %>
</head>

Selepas penyusunan:
<head>
    <title>页面标题</title>
    <link rel="stylesheet" href="../../dev/css/style-workflow.css"/>
    <!--<link rel="stylesheet" href="http://wximg.gtimg.com/tmt/workflow/dist/css/style-workflow.css"/>-->
</head>

text() Teks pemegang tempat

Jana imej pemegang tempat dengan panjang yang ditentukan Parameter kedua ialah nombor perkataan mengimbangi

Sebagai contoh, fungsi berikut mungkin menghasilkan teks panjang 7 ~ 13 bit.
<%- img(200, 400, 'block__img') %>
Disusun:

<img src="http://temp.im/200x400" class="block__img"/>

Lebih banyak fungsi templat? Menunggu anda untuk mengambilnya~