Учебники

RIOT.JS — Выражения

Июль 19, 2018

RIOT js использует {} для определения выражений. RIOT JS позволяет следующие типы выражений.

  • Простое выражение — определение переменной и использование внутри тега.

Простое выражение — определение переменной и использование внутри тега. 

<customTag>
   <h1>{title}</h1>
   <script>
      this.title = "Welcome to TutorialsPoint.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 TutorialsPoint.COM";
      this.val = 4;
   </script>
</customTag>

index.htm 

<!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>

Это даст следующий результат —

40
Share: