Riot.jsタグのうち1つだけがレンダリングされるのはなぜですか？

Question

私はCDNからRiot.js、ローカルスクリプトファイルからRiotControl、ファイルからRiotControl用にStore、そして2つのカスタムタグcustom-aとcustom-bをロードする比較的簡単なページを持っています。 2つのタグファイル内console.log行があることを示す - -

<div class="ui text container" id="context"> 
     <form class="ui form"> 
      <h1>A Descriptive and Lovely Header</h1> 

      <div class="ui divider"></div> 

      <custom-a/> 

      <p>this is just a paragraph</p> 
      <custom-b/> 
     </form> 
    </div> 

    <!-- Riot.js Ceremony --> 
    <script> 
     RiotControl.addStore(new Store()); 
     riot.mount('*'); 
    </script> 

タグが搭載されているとイベントが（再びconsole.log経由で実績のある）正しく配線されています。ただし、最初のカスタムタグのレンダリング後は何も表示されません。先頭にある場合はcustom-aが表示され、上にある場合はcustom-bが表示されますが、その間の<p>はレンダリングされず、レンダリングされません。

CSSで問題があるかもしれないと思ったので、セマンティックUIリンクをページから削除しましたが、スタイル以外に違いはありません。

アイデア？

Answer 1

これはブラウザが自己終了タグをレンダリングする方法です。 https://github.com/riot/riot/issues/1111チェックが

に答えるGianlucaGuarini：

<div>Element before</div> 
<self-close> 
    <div>Element after</div> 
</self-close> 

REFをレンダリング

<div>Element before</div> 
<self-close/> 
<div>Element after</div> 

前にこのフィドルhttps://jsfiddle.net/9uezdbo9/1/

をチェック

Answer 2

これは驚くほど簡単なことです。Riot.jsの「オンザフライでコンパイル」という側面は、自己終了タグではうまく対応していないようです。これは正常に動作します：

<custom-a></custom-a> 
<custom-b></custom-b>