属性応答
前述のプロパティバインディングでは、コンポーネントのプロパティ値をテキスト表示にレンダリングする方法、つまり単純なプロパティ応答メカニズムを紹介しました。
ofa.jsは基本的な属性値のリアクティブをサポートするだけでなく、多層にネストされたオブジェクト内部の属性値のリアクティブレンダリングもサポートしています。
count: {{count}}
count2: {{obj.count2}}
すべてのofa.jsインスタンスオブジェクトにバインドされたデータは、自動的にリアクティブデータに変換されます。リアクティブデータは、文字列、数値、ブール値、配列、オブジェクトなどの基本データ型のみをサポートしています。関数やクラスインスタンスなどの複雑なデータ型については、非リアクティブ属性として保存する必要があり、これらの属性の変更はコンポーネントの再レンダリングをトリガーしません。
非リアクティブデータ
時には、Promiseインスタンスや正規表現オブジェクト、その他の複雑なオブジェクトなど、リアクティブな更新を必要としないデータを保存する必要があります。その場合、非リアクティブなプロパティを使用します。これらのプロパティの変更はコンポーネントの再レンダリングを引き起こさず、ビューとの連動を必要としないデータの保存に適しています。
非レスポンシブプロパティの命名では、通常、プロパティ名の前にアンダースコア _ をプレフィックスとして付け、レスポンシブプロパティとの区別を示します。
count: {{count}}
count2: {{_count2}}
Green incrementsボタンをクリックすると、_count2の数値は実際に増加しているが、それは非リアクティブなプロパティであるためビューの更新がトリガーされず、画面上の表示は変化しない。Blue increasesボタンをクリックすると、countはリアクティブなプロパティなのでコンポーネント全体の再レンダリングがトリガーされ、その際に初めてGreenの表示内容が同期して更新される。
非応答的なオブジェクトデータは、応答的なオブジェクトデータよりもパフォーマンスが良くなります。非応答的なデータはコンポーネントの再レンダリングをトリガーしないためです。