在Jade/Pug中创建动态类

Not*_*ter 8 interpolation dynamic-class-creation pug

我正在尝试将动态类添加到玉器模板中.像这样:

- var obj = {a: 1, b: 2, c: 3};
- var len = Object.keys(obj).length;

.abc-#{len}
Run Code Online (Sandbox Code Playgroud)

但编译器对此不以为然:

  > 4| .abc-#{len}
------------^

Unexpected token `interpolation` expected `text`, `interpolated-code`, `code`, `:`, `slash`, `newline` or `eos`
Run Code Online (Sandbox Code Playgroud)

我已经尝试了我能想到的一切.正在搜索https://pugjs.org/language/interpolation.html.真的可以用一只手.

谢谢.

Moh*_*Ted 20

你可以这样做:

div(class="abc-"+len)

属性会自动中断,更多属于属性

  • 类值也可以是一个数组:`div(class=['foo', 'bar', 'baz']` (2认同)

Ahm*_*ais 6

您也可以使用 ES6 模板文字。例如

div(class=`static_${dynamic_variable}` 
Run Code Online (Sandbox Code Playgroud)

在你的情况下:

div(class=`abc-${len}`)
Run Code Online (Sandbox Code Playgroud)

玩得开心。