Question

我有一个符合我的手写笔的构建脚本，并传递了一些数据。

stylus(stylFile)
  .set('filename', 'index.css')
  .define('data', require('./data.json'))
  .render(...)

data.json文件包含一个组对象，每个组由更多表示项目的对象组成。

{
  "group1": {
    "item1": {
      "width": 1
    },
    "item2": {
      "width": 2
    }
  },
  "group2": {
    "item3": {
      "width": 3
    }
  }
}

在我的Stylus文件中，我想遍历各个组，然后通过他们的项目进行迭代

for group, items in data
  #{group}
    for id, item in items
      #{id}
        width item.width

我希望这个输出是

#group1 #item1 {
  width: 1;
}
#group1 #item2 {
  width: 2;
}
#group2 #item3 {
  width: 3;
}

相反，我得到

ParseError: index.css:118:1
   114|   #{group}
   115|     for id, item in items
   116|       #{id}
   117|         width item.width
   118| 
--------^

expected "indent", got "outdent"

Answer 1

我不知道你如何在手写笔中获得json但是使用哈希对象你可以这样做：

<强> STYLUS

data={
  "group1": {
    "item1": {
      "width": 1
    },
    "item2": {
      "width": 2
    }
  },
  "group2": {
    "item3": {
      "width": 3
    }
  }
}

for group in data
  #{group}
    items = data[group]
    for item in items
      #{item}
        for property, value in items[item]
          {property} value

<强>输出

#group1 #item1 {
  width: 1;
}
#group1 #item2 {
  width: 2;
}
#group2 #item3 {
  width: 3;
}

<强>更新

您可以从手写笔文件中获取json并转换为哈希对象：

data = json('data.json', { hash: true })

for group in data
  #{group}
    items = data[group]
    for item in items
      #{item}
        for property, value in items[item]
          {property} value

迭代Stylus中的嵌套对象

1 个答案: