手写笔：使用迭代来创建一组带有mixins的媒体查询

Question

我在Stylus中设置了一组断点：

breaks = 320 415 900

我希望循环使用这些并为每个media-query生成一个不同的@media( max-width: 320px ) { Component_H2_320() } @media( max-width: 415px ) { Component_H2_415() } @media( max-width: 900px ) { Component_H2_900() } ，并通过每个内容中的mixin设置相应的字体：

即。我想要这样的结果：

for break in breaks
    @media (max-width: break px) {
         Component_H2_{break}()
    }

这就是我在Stylus中所拥有的：

{{1}}

不确定为什么这不会产生我正在寻找的输出。

Answer 1

尝试使用“触控笔”页面{'.string_' + var} => .string_varcontent

中列出的插值

breaks = 300 400 500

component_H2_300()
  width 300px
component_H2_400()
  width 400px
component_H2_500()
  width 500px

for break in breaks
  @media (min-width: break px)
    h1
      {'component_H2_' + break}()
      height break px