Question

我为Bootstrap 4开发了RiotJS包装器。您可以在Plunker上查看live example。有一个自定义标签

<item>
    <a class="dropdown-item" href="#">
        <yield/>
    </a>
</item>

我以下列方式使用它：<item>Action</item>。得到以下输出：

<item>
    <a class="dropdown-item" href="#"> </a>
    <a class="dropdown-item" href="#"> </a>
    <a class="dropdown-item" href="#"> Action </a>
</item>

有谁知道为什么会生成前2个空链接以及如何避免它们？

Answer 1

它与标签的安装以及<yield />有关。这里不确定确切的问题，但解决问题的方法是将最外面的标记仅挂载，不要明确地挂载每个子标记。

因此，在示例代码的index.html中，替换：

<script> riot.mount('caret'); riot.mount('divider'); riot.mount('heading'); riot.mount('item'); riot.mount('content'); riot.mount('toggle'); riot.mount('dropdown'); </script>

... with：

<script> riot.mount('dropdown'); </script>

RiotJS <yield>产生空输出

1 个答案: