if else else在Jade中有一行代碼與子元素的差異

Question

我想讓我的代碼更加乾爽，並且在如何在if/else語句中獲得單行同時保持孩子div低於結果if/else語句。

我已經嘗試了花括號，但是，我無法讓它工作。 謝謝！

if (viewOptions.visible == 'true') 
     .myDiv1   
    else 
     .myDiv1(style="display:none") 
      //either way children get added to myDiv1 

Answer 1

我使用的解決方案是使用從哈巴狗文檔一個混合和&attributes(attributes)：https://pugjs.org/language/mixins.html

if (viewOptions.dataVisibility == 'true') 
     +propertySection('My input', "enter a number", source._data.length, 'myInputName')    
    else 
     +propertySection('My input', "enter a number", source._data.length, 'myInputName')(style="display:none") 

mixin propertySection(header, label, initVal, inputName) 
    .myDiv1&attributes(attributes) 
    .myHeader= header 
    .myLabel= label 
    input(value='#{initVal}' name="#{inputName}")