1. ホーム
  2. javascript

[解決済み] Ember.jsにおけるビューとコンポーネントの比較

2022-05-17 23:39:30

質問

ember.jsを勉強しているのですが、ビューとコンポーネントの違いを理解しようとしています。 私はどちらも再利用可能なコンポーネントを作成する方法として見ています。

Emberのホームページからビューについて。

Ember.jsのビューは、通常、以下の理由でしか作成されません。

-ユーザーイベントを高度に処理する必要がある場合

-ユーザーイベントを処理するために 再利用可能なコンポーネント

Emberのコンポーネントに関するサイトより。

コンポーネントとは、JavaScriptで動作を実装し、Handlebarsのテンプレートを使って外観を記述するカスタムHTMLタグのことです。コンポーネントを利用することで 再利用可能なコントロール を作成し、アプリケーションのテンプレートを簡素化することができます。

ビューとコンポーネントの主な違いは何ですか? また、コンポーネントよりもビューを使用することを好む、あるいはその逆の一般的な例とはどのようなものでしょうか?

どのように解決するのですか?

Ember.View

Ember.View は現在、W3C によって作成されたタグに限定されています。しかし、アプリケーション固有のHTMLタグを独自に定義し、その動作をJavaScriptで実装したいと考えた場合、どうでしょうか。これを実際に行うには Ember.View .

Ember.Component(エンバーコンポーネント

これこそまさにコンポーネントでできることです。実際、これはとても良いアイデアで、現在 W3C では カスタム要素 の仕様に取り組んでいます。

Emberのコンポーネントの実装は、できる限りWeb Componentsの仕様に近づけようとしています。一度 カスタム要素 がブラウザで広く利用できるようになれば、Ember のコンポーネントを W3C 標準に簡単に移行でき、新しい標準を採用した他のフレームワークでも使用できるようになるはずです。

これは私たちにとって非常に重要なことなので、私たちのコンポーネントの実装がウェブプラットフォームのロードマップと一致するように、標準化団体と密接に連携しています。

また、重要な点として Ember.Component は実際には Ember.View (サブクラス)ですが、これは完全に 孤立している . そのテンプレートでのプロパティアクセスは ビュー オブジェクトにアクセスし、アクションは ビュー オブジェクトも対象となります。周囲の context または外側の controller にはすべての文脈情報が渡されます。 で渡されますが、これは Ember.View の場合はそうではなく、その周囲のコントローラにアクセスすることができます。 this.get('controller') のようにすると、そのビューに現在関連付けられているコントローラを取得できます。

では、ビューとコンポーネントの主な違いは何でしょうか?

主な違いは、コンポーネントでは独自のタグを作成できることと、将来のある時点で カスタム要素 は、カスタム要素をサポートする他のフレームワークでそれらのコンポーネントを移行/使用することも可能ですが、確かにいくつかの点でemberコンポーネントは、特定の実装ケースに応じて、ビューをやや陳腐化することである。

コンポーネントよりもビューを使用することを好む一般的な例と、その逆はどのようなものでしょうか?

上記のように、これは明らかにあなたのユースケースに依存します。しかし、経験則から言うと、ビューでその周辺のコントローラなどにアクセスする必要がある場合は Ember.View を使用しますが、ビューを分離し、動作に必要な情報のみを渡すことで、コンテキストに依存しない、より再利用性の高いビューを実現したい場合は Ember.Component .

お役に立てれば幸いです。

更新情報

の公開に伴い Ember 2.0への道 の発表により、ほとんどの場合、View の代わりに Component を使用することが推奨されるようになりました。