哈巴狗在输入中嵌套内容

Question

您好我正在尝试创建嵌套的mixins，它可以在pug中显示bootstrap radio button

mixin input(textinput)
   label.btn.btn-secondary
      input(type="radio" name="options" id="option1" autocomplete="off")= textinput

mixin btn-toggle-group(textinput)
   .btn-group(data-toggle="button")

    +btn-toggle-group  
                    +input('coca')
                    +input('pepsi')
                    +input('orangina')
                    +input('lemonade')

但它给我输入错误是一个自闭元素，但它包含嵌套内容

Answer 1

该错误是由于尝试通过textinput使TextNode单个单选按钮的=子项显然必须失败。

如果想要渲染 下一个兄弟 文本节点，则会有|运算符（管道）和插值。但也可以使用另一个html元素，如span。示例代码提供了Bothe变体。

应该记住，没有特征值的单选按钮（特别是在一个广播组中）几乎没用。将textinput分配给单选按钮的value属性可能很有用。

还应该避免将id或class属性直接传递到 标记 ，而应该通过{{{ 1}}用于ids或#用于类名。

最后，如果想要将所有标记的无线电控件附加到.已分类的btn-group元素，则需要通过精心缩进的div关键字对其进行标记。

block

以上提供的经过清理和测试的代码现在可以正常运行。

阅读pug documentation（attributes，interpolation，mixins，inheritance/templates/blocks，也有帮助。