2016-07-26 6 views
1

У меня есть сценарий сборки, который соответствует мой стилус и передает некоторые данные.Итерация над вложенными объектами Stylus

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" 
+0

У меня есть ощущение, что это что-то делать с Стилус встроенной „хэшей“, которые мои данные должны получить принуждался. – arkanciscan

ответ

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 
+0

Я получаю json в стилусе, используя функцию 'define()' в моем скрипте сборки. Таким образом, NPM открывает JSON, превращает его в объект JS, а затем передает его Stylus, который, как я полагаю, принуждает его к хешу. – arkanciscan

+0

Извините, но ваше решение не работает для меня при использовании данных из JSON. Я получаю '#id # { (null): 0; } 'повторяется для каждого элемента. – arkanciscan

+0

Я редактирую свой ответ, может быть, полезно для вас – blonfu