Riotjs-yield
提供:Dev Guides
RIOT.JS-利回り
収量は、外部HTMLコンテンツをRIOTタグに入れるメカニズムです。 利回りを行う方法は複数あります。
- Simple Yield -タグ内の単一のプレースホルダーを置き換えたい場合。 次に、このメカニズムを使用します。
<custom3Tag>
Hello <yield/>
</custom3Tag>
<custom3Tag><b>User</b></custom3Tag>
- Multiple Yield -タグ内の複数のプレースホルダーを置き換えたい場合。 次に、このメカニズムを使用します。
<custom4Tag>
<br/><br/>
Hello
<yield from = "first"/>
<br/><br/>
Hello
<yield from = "second"/>
</custom4Tag>
<custom4Tag>
<yield to = "first">User 1</yield>
<yield to = "second">User 2</yield>
</custom4Tag>
例
以下は完全な例です。
custom3Tag.tag
<custom3Tag>
Hello <yield/>
</custom3Tag>
custom4Tag.tag
<custom4Tag>
<br/><br/>
Hello
<yield from = "first"/>
<br/><br/>
Hello
<yield from = "second"/>
</custom4Tag>
カスタム3
<html>
<head>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
</head>
<body>
<custom3Tag><b>User</b></custom3Tag>
<custom4Tag>
<yield to = "first">User 1</yield>
<yield to = "second">User 2</yield>
</custom4Tag>
<script src = "custom3Tag.tag" type = "riot/tag"></script>
<script src = "custom4Tag.tag" type = "riot/tag"></script>
<script>
riot.mount("custom3Tag");
riot.mount("custom4Tag");
</script>
</body>
</html>
これにより、次の結果が生成されます–