如何在 JADE 中自定义这个 mixin

Question

我正在 Jade 中开发一个 mixin，它使用 img 标签创建 div...这里是 mixin 代码：

mixin image(pics)
  each pic in pics
    .row
      .col-md-4
        img.img-responsive(src="#{pic.path}" alt="#{pic.name}")

这里是我使用 mixin 的例子：

+image([
    {'name':'anti'    , 'path':'/images/anti.jpg'},
    {'name':'dark'    , 'path':'/images/dark.jpg'},
    {'name':'haik'    , 'path':'/images/haik.jpg'},
    {'name':'james'   , 'path':'/images/james.jpg'},
    {'name':'johanna' , 'path':'/images/johanna.jpg'},
    {'name':'timothy' , 'path':'/images/Timothy.jpg'}
    ])

是否可以将所有这些值分配给其他文件中的变量，然后包含该文件并使用 mixin？如果是，如何？ :D

这是目标，我只是演示我的意思，显然下面的代码不会工作：

var allPics = [
        {'name':'anti'    , 'path':'/images/anti.jpg'},
        {'name':'dark'    , 'path':'/images/dark.jpg'},
        {'name':'haik'    , 'path':'/images/haik.jpg'},
        {'name':'james'   , 'path':'/images/james.jpg'},
        {'name':'johanna' , 'path':'/images/johanna.jpg'},
        {'name':'timothy' , 'path':'/images/Timothy.jpg'}
        ]

+image(allPics)

Answer 1

是的，您可以在包含的文件中使用变量以及 Mixins。

test.jade 包括 test_include.jade

test_include.jade:

- var allPics  = [{'name':'anti'    , 'path':'/images/anti.jpg'},{'name':'dark'    , 'path':'/images/dark.jpg'},{'name':'haik'    , 'path':'/images/haik.jpg'},{'name':'james'   , 'path':'/images/james.jpg'},{'name':'johanna' , 'path':'/images/johanna.jpg'},{'name':'timothy' , 'path':'/images/Timothy.jpg'}]
mixin image(pics)
  each pic in pics
    .row
      .col-md-4
        img.img-responsive(src="#{pic.path}" alt="#{pic.name}")
block content

test.jade:

extends test_include
  block content
   +image(allPics)

如何在 JADE 中自定义这个 mixin

How to Customize this mixin in JADE

mixins

node.js

pug