Jade里的mixin使用

原创于 2018-09-07 09:21:39 发布 · 223 阅读

CC 4.0 BY-SA版权

本文介绍了一种使用混入(mixin)技术来优化表格数据展示的方法，通过定义通用的混入模板，可以轻松地将数据转换为表格格式，支持动态数据填充，适用于多种数据类型，如节点数据和JS数据。这种方法不仅提高了代码的复用性和可维护性，还简化了数据展示的复杂度。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

声明的语法： mixin name(param, param2, …….)
调用： +name(data)

mixin row(items)
    tr
        each item, index in items
            td= item
mixin table(tableData)
    table
        each row, index in tableData
            +row(row)
- var node = [{name: "node1"}, {name: "node2"}, {name: "node3"}]
+table(node)
 
- var js = [{name: 'node4'}, {name: 'node5'}, {name: "node6"}]
+table(js) 
1
2
3
4//输出
<table>
    <tr>
        <td>node1</td>
    </tr>
    <tr>
        <td>node2</td>
    </tr>
    <tr>
        <td>node3</td>
    </tr>
</table>
 
<table>
    <tr>
        <td>node4</td>
    </tr>
    <tr>
        <td>node5</td>
    </tr>
    <tr>
        <td>node6</td>
    </tr>
</table>