ノードのプロパティは、html定義のdefaultsオブジェクトによって定義されています。
これらはノードのインスタンスがランタイムで作成された時、
ノードコンストラクタ関数に渡されるプロパティです。
はじめてのノード開発の例では、
ノードにはnameという単一のプロパティがありました。
このセクションでは、ノードにprefixという新しいプロパティを追加します:
defaultsオブジェクトに新しいエントリを追加します:
defaults: {
name: {value:""},
prefix: {value:""}
},
エントリには、このタイプの新しいノードがワークスペースにドラッグされたときに
使用されるデフォルト値valueが含まれます。
<div class="form-row">
<label for="node-input-prefix"><i class="fa fa-tag"></i> Prefix</label>
<input type="text" id="node-input-prefix">
</div>
テンプレートには、idにnode-input-<propertyname>が設定された
<input>要素が含まれていなければなりません。
function LowerCaseNode(config) {
RED.nodes.createNode(this,config);
this.prefix = config.prefix;
var node = this;
this.on('input', function(msg) {
msg.payload = node.prefix + msg.payload.toLowerCase();
node.send(msg);
});
}
defaultsオブジェクト内のエントリはオブジェクトである必要があり、以下の属性を持つことができます:
value : (任意の型) プロパティが持つデフォルト値required : (boolean) オプション プロパティが必須かどうか。
trueにすると、値がnullまたは空文字列の場合、プロパティが無効になります。validate : (function) オプション プロパティの値を
検証するために使用する関数。type : (string) オプション このプロパティが設定ノードへのポインタである場合、
これはノードのタイプを識別します。使用してはいけない プロパティの予約名がいくつかあります:
x, y, z, d, g, lは既に使用されています。
その他も将来使用する予約語です。id, type, wires, inputs, outputsノードが提供する出力の数を設定可能にしたい場合、
outputsをdefaults配列に含めることができます。
Functionノードは、これがどのように機能しているかを示す例です。
エディタは無効な値が与えられた場合にユーザに警告するため、 すべてのプロパティを検証しようとします。
required属性は、
プロパティが非nullで非blankでなければならないことを示すために使用できます。
より具体的な検証が必要な場合、validate属性を使用して値が有効であることを確認する関数を提供することができます。
この関数には値が渡され、trueまたはfalseが返却する必要があります。
これはノードコンテキスト内で呼び出されるため、
ノードの他のプロパティにアクセスするためにthisを利用できることを意味します。
これにより、検証は他のプロパティ値に依存することができるようになります。
ノードを編集しているあいだ、thisオブジェクトはノードの現在の設定を反映しており、
現在のフォームの要素の値ではありません。
バリデータ関数はプロパティ設定要素にアクセスしようとし、
thisオブジェクトを正しいユーザエクスペリエンスを成し遂げるための予備とします。
共通の検証関数が用意されています。
RED.validators.number() - 値が数字であることを確認するRED.validators.regex(re) - 指定された正規表現に一致する値を
チェックするrequired属性およびvalidate属性どちらのメソッドでも同じ方法でUIに反映されます。
値が不正または欠落しているとき、ノードの欠落設定マーカーが呼び出され、
対応する入力が赤で囲まれます。
次の例では、これらのバリデータのそれぞれを適用することができる方法を示しています。
defaults: {
minimumLength: { value:0, validate:RED.validators.number() },
lowerCaseOnly: {value:"", validate:RED.validators.regex(/[a-z]+/) },
custom: { value:"", validate:function(v) {
var minimumLength=$("#node-input-minimumLength").length?$("#node-input-minimumLength").val():this.minimumLength;
return v.length > minimumLength
} }
},
customプロパティは、minimumLengthプロパティの現在の値、
またはminimumLengthフォーム要素の値よりも大きい場合のみ有効であることに
注意してください。
編集ダイアログが開かれると、 エディタはノードの編集テンプレートをダイアログに入力します。
defaults配列の各プロパティについて、
idがnode-input-<propertyname>、または設定ノードではnode-config-input-<propertyname>に設定されている<input>要素を探します。
この入力には、プロパティの現在の値が自動的に入力されます。
編集ダイアログが閉じられると、プロパティは入力にある値を取ります。
編集ダイアログについての更なる情報はこちらで入手できます。
デフォルトの動作は多くの場合で動作しますが、
場合によってはいくつかのノード固有の動作を定義します。
たとえば、プロパティを簡単な<input>や<select>として適切に編集できない場合や、
編集ダイアログのコンテンツ自体に、
選択されているオプションに基づいて特定の動作を持っている必要があります。
ノード定義には、編集動作をカスタマイズする2つの関数を含めることができます。
oneditprepareは編集ダイアログが表示される直前に呼び出されます。oneditsaveは編集ダイアログで完了ボタンが押された時に呼び出されます。oneditcancelは編集ダイアログがキャンセルボタンが押された時に呼び出されます。oneditdeleteは設定ノードの編集ダイアログの削除ボタンが押された時に
呼び出されます。oneditresizeは編集ダイアログがリサイズされた時に呼び出されます。例えばInjectノードが繰り返すように設定されている場合、
それはcronのような文字列として設定を保存します: 1,2 * * * *
ノードは、その文字列を解析してよりユーザフレンドリなUIを提示できるoneditprepare関数を定義します。
また、ユーザが選択したオプションを
対応するcron文字列にコンパイルするoneditsave関数もあります。
Node-RED: Low-code programming for event-driven applications.
Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.
The OpenJS Foundation | Terms of Use | Privacy Policy | OpenJS Foundation Bylaws | Trademark Policy | Trademark List | Cookie Policy