RiotJS <yield/> 生成空输出

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>

...与：

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

RiotJS <yield/> 生成空输出

RiotJS <yield/> generates empty output

javascript

riot.js