m.withAttr
この関数はイベントハンドラを生成するファクトリ関数です。この関数は、DOMエレメントのイベントリスナとして使えるメソッドを返します。
一般的に、この関数はm.prop
と組み合わせて、ビューからモデル方向のデータバインディングを作成するのに使います。
このメソッドは、ブラウザのイベントモデルと、コントローラ/ロジックモデルを疎結合にします。
Mithrilを使う場合には、このメソッドを使うか似たような機能を実装して、ブラウザのイベントオブジェクトからプログラムに使う値を取り出す操作を、コントローラやモデルにハードコードしないコーディングをしてください。
使用方法
//単独での使用
document.body.onclick = m.withAttr("title", function(value) {
//bodyエレメントのタイトルがクリックされたらアラートを出す
alert(value);
})
双方向データバインディングのサンプル
var user = {
model: function(name) {
this.name = m.prop(name);
},
controller: function() {
return {user: new user.model("John Doe")};
},
view: function(controller) {
m.render("body", [
m("input", {onchange: m.withAttr("value", controller.user.name), value: controller.user.name()})
]);
}
};
シグニチャ
EventHandler withAttr(String property, void callback(any value) [, any callbackThis])
where:
EventHandler :: void handler(Event e)
String property
この関数のコールバックに渡したい値を持つ、DOMエレメントのプロパティを設定します。
void callback(any value)
この関数は引数として定義されたプロパティの値とともに呼ばれます。
any value
これは定義されたDOMエレメントの値です。
any callbackThis
コールバック内で
this
キーワードが指すオブジェクトを指定します。returns EventHandler handler
このハンドラメソッドは、
onclick
などのプロパティに設定したり、addEventListener
にコールバックとして渡すことができるメソッドです。