Riotjs-expressions

提供：Dev Guides

移動先:案内、検索

RIOT.JS-式

RIOT jsは\ {}を使用して式を定義します。 RIOT jsでは、次のタイプの式を使用できます。

簡単な式-変数を定義し、タグ内で使用します。

<customTag>
   <h1>{title}</h1>
   <script>
      this.title = "Welcome to finddevguides.COM";
   </script>
</customTag>

式を評価-操作で使用するときに変数を評価します。

<customTag>
   <h2>{val * 5}</h2>
   <script>
      this.val = 4;
   </script>
</customTag>

オプションオブジェクトから値を取得-属性を介してタグに渡された値を取得します。

例

上記の概念の完全な例を次に示します。

customTag.tag

<customTag>
   <h1>{title}</h1>
   <h2>{val * 5}</h2>
   <h2>{opts.color}</h2>
   <script>
      this.title = "Welcome to finddevguides.COM";
      this.val = 4;
   </script>
</customTag>

索引

<!DOCTYPE html>
<html>
   <head>
      <script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
   </head>
   <body>
      <customTag color="red"></customTag>
      <script src = "customTag.tag" type = "riot/tag"></script>
      <script>
         riot.mount("customTag");
      </script>
   </body>
</html>

これにより、次の結果が生成されます–

「https://www.finddevguides.com/index.php?title=Riotjs-expressions&oldid=17194」から取得

Riotjs Tutorial