玉/帕格：如何在另一个混入

Question

我试图使用原子设计模式在玉/帕格创建一个简单的列表，在一个链接的参数数组使用一个mixin。我的名单混入如下，接受项目的数组：

include ../../atoms/listitem/listitem 
mixin list(spec) 
    - spec = spec || {} 
    - spec.__class = spec.__class || '' 
    - spec.type = spec.type || 'ul' 
    - spec.items = spec.items || {} 

    if spec.items.length 
     #{spec.type} 
      for item in spec.items 
       +listitem({content: item}) 

列表项：

mixin listitem(spec) 
    - spec = spec || {} 
    - spec.__class = spec.__class || '' 
    - spec.content = spec.content || '' 

    li(class=spec.__class)&attributes(attributes) 
     != spec.content 

链接：

mixin link(spec) 
    - spec = spec || {} 
    - spec.__class = spec.__class || '' 
    - spec.text = spec.text || 'Default Link' 

    a.link(class=spec.__class)&attributes(attributes) 
     if block 
      block 
     else 
      != spec.text 

而且在我的模板，我有以下：

include _modules/atoms/link/link 
include _modules/molecules/list/list 

block content 
    +list({items: [ 
     'list item 1', 
     'list item 2', 
     +link({text: "Hi link"})(href="#"), 
     'list item 4' 
    ]}) 

我得到一个ER ror：

但是，如果我使用该项目数组之外的链接它工作得很好。我究竟做错了什么？

Answer 1

唉，你不能在玉传递一个mixin作为论据另一个混入。如果您想保留大部分格式：为了获得您想要的功能，您必须在多个实例中使用类型检测，并将您的参数作为数组传递。

mixin listitem(spec) 
    - spec = spec || {} 
    - spec.__class = spec.__class || '' 
    - spec.content = spec.content || '' 

    li(class=spec.__class)&attributes(attributes) 
     if (typeof spec.content === 'string') 
     != spec.content 
     else 
     block 

mixin link(spec) 
    - spec = spec || {} 
    - spec.__class = spec.__class || '' 
    - spec.text = spec.text || 'Default Link' 
    - attributes = spec.attributes || '' 


    a.link(class=spec.__class)&attributes(attributes) 
     if block 
      block 
     else 
      != spec.text 


mixin list(spec) 
    - spec = spec || {} 
    - spec.__class = spec.__class || '' 
    - spec.type = spec.type || 'ul' 
    - spec.items = spec.items || {} 

    if spec.items.length 
     #{spec.type} 
      for item in spec.items 
       +listitem({content: item}) 
       if (item[0]) 
        +link(item[0]) 


block content 
    +list({items: [ 
     'list item 1', 
     'list item 2', 
     [{text: "Hi link"}], 
     'list item 4' 
    ]}) 

Answer 2

一个混合不能在一个数组中的对象。考虑重新格式化对象，并接近这样的问题（简化通信概念）：

- 
    var myList = [ 
    {text: 'list item 1'}, 
    {text: 'list item 2', link: '#'}, 
    {text: 'list item 3'} 
    ]; 

mixin list(listObject) 
    ul 
    for each listItemObject in listObject 
     +listItem(listItemObject) 

mixin listItem(listItemObject) 
    li 
    if (listItemObject.link.length > 0) 
     a(href= listItemObject.link)= listItemObject.text 
    else 
     #{listItemObject.text}