0

Knockoutjs.i を学習しようとすると、Knockoutjs カスタム バインディング関連のコードが見つかりましたが、あまり良くありません。

<input data-bind="value: name" />
<hr/>
<div data-bind="fadeInText: name"></div>

ko.bindingHandlers.fadeInText = {
    update: function(element, valueAccessor) {
        $(element).hide();
        ko.bindingHandlers.text.update(element, valueAccessor);
        $(element).fadeIn(); 
    } 
};

var viewModel = {
    name: ko.observable("Bob")
};

ko.applyBindings(viewModel);

人々がいつカスタムバインディングを選ぶのか理解できませんか？

1) 可能であれば、カスタム バインディングがオプションになる状況をいくつか教えてください。

2) 誰かがコードを見れば、カスタムバインディングの fadeInText と viewModel には関係がないことを理解できますが、それでも機能しています。どうやって ？

3)複数のビューモデルがある場合、バインディング時にビューモデル名をバインディング名で指定するにはどうすればよいですか?

上記コードの jsfiddle リンクhttp://jsfiddle.net/rniemeyer/SmkpZ/

4) カスタム バインディングなしで同じ出力を実現する方法は? 可能でしたか？

私の質問に賢明に答えてください。ありがとう

4

1 に答える 1

4

ここにいくつかの答えがあります：

  1. カスタム バインドは多くのシナリオで役立ちますが、私の意見では、最後の手段として使用するべきではありません。組み込みバインディングでまだサポートされていない方法で DOM とデータを接続したい場合はいつでも、組み込みバインディングが適しています。上記のように、明確にするのに役立つ記事を次に示します。

  2. カスタム バインディングは、 を呼び出すことによって間接的にビュー モデルと関係を持ちますko.bindingHandlers.text.update。したがって、実際のtextバインディングを効果的にラップしています。textバインディングは、渡された値を読み取り、表示します。

  3. 複数のビュー モデルの場合、この回答では、複数のビュー モデルを処理するためのいくつかのオプションについて説明します。

  4. カスタム バインディングがなければ、jQuery を使用せずに CSS を使用することを選択できます (ブラウザーのサポートとプレフィックスを考慮して)。たとえば、次のような要素にクラスをすぐに追加できます。

次のような CSS を使用します。

.message {
    opacity: 0;
    transition: opacity 2s ease-in;
}

.load {
    opacity: 1;
}

要素は2 秒以上で開始されopacity: 0、すぐに遷移します。opacity: 1

ビュー モデルで jQuery を直接使用することはお勧めしません。カスタム バインドは、これらのシナリオで使用できるツールであり、Knockout が提供する多くの機能を提供します。

お役に立てれば。

于 2015-05-15T16:23:10.620 に答える