変数を使用すると、ユーザーの入力を保存し、プロトタイプ内で提供されたデータに基づいてアクションを実行することができます。

変数を使用して、動的なテキスト要素を作成したり、ユーザーの好みに合わせてデザインの内容を調整したり、プロトタイプの他の場所に表示するデータ(名前など)を収集したりすることができます。

変数の値はグローバルであり、すべてのページで使用することができます。

変数の作成

画面下にある Variables をクリックし、+New variableをクリックします。次に、変数の名前を付け、Enterで確定します。

https://uxpincommunity.cdn.prismic.io/uxpincommunity%2F6d801a40-2554-4af2-8029-fde71abd03ea_variables_creating+variables.mp4

変数名の付け方

変数(Variables)の名前を指定するときは、いくつかの規則に従う必要があります。 すべての変数名はアルファベット(アルファベットと数字を含む)で始まり、スペースは含まれず、25文字以下でなければなりません。 変数名は自動的に短縮され、必要に応じてスペースが削除されます。

また、次の構文は変数名として使用できません。

do, if, in, for, let, new, try, var, case, else, enum, eval, null, this, true, void, with, await, break, catch, class, const, false, super, throw, while, yield, delete, export, import, public, return, static, switch, typeof, default, extends, finally, package, private, continue, debugger, function, arguments, interface, protected, implements, instanceof.

しかし、これらのいずれかを使用する場合、アンダースコアと数字を追加することで自動的に変数名を適用させます。

後で自分および同僚が理解しやすいように、説明的な名前を使用するのが最善です。

<aside> 🖇️ 備考 変数名の変更はできませんのでご注意ください。

</aside>

変数の管理

変数の管理は、ツールバーの下にある{$}で実行できます。