Vistas vs componentes en Ember.js

Estoy aprendiendo brasa.js, y estoy tratando de entender la diferencia entre una vista y un componente. Veo ambos como una forma de hacer componentes reutilizables.

Desde el sitio web de Ember en vistas:

Vistas en Ember.por lo general, los js solo se crean por las siguientes razones:
- Cuando se necesita un manejo sofisticado de los eventos de usuario
- Cuando se quiere crear un componente reutilizable

Del sitio web de Ember sobre componentes:

A el componente es una etiqueta HTML personalizada cuyo comportamiento se implementa utilizando JavaScript y cuya apariencia se describe utilizando plantillas de Manillares. Le permiten crear controles reutilizables que pueden simplificar las plantillas de su aplicación.

Entonces, ¿cuál es la principal diferencia entre una vista y un componente? ¿Y cuál sería un ejemplo común donde preferiría usar una vista sobre un componente y viceversa?

Author: Bradley Trager, 2013-09-03
Source

3 answers

Ember.Ver

Una Brasa .View se limita actualmente a las etiquetas que se crean para usted por el W3C. Pero si desea definir sus propias etiquetas HTML específicas de la aplicación y luego implementar su comportamiento utilizando JavaScript? No puedes hacer esto realmente con una brasa .Ver .

Ember.Componente

Eso es exactamente lo que los componentes te permiten hacer. De hecho, es una buena idea que el W3C esté trabajando actualmente en el Personalizado Elements spec.

La implementación de componentes de Ember intenta ser lo más cercana posible a la especificación de Componentes Web. Una vez Elementos Personalizados están ampliamente disponibles en los navegadores, usted debe ser capaz de migrar fácilmente sus componentes Ember al estándar W3C y hacer que sean utilizables por otros marcos, así que han adoptado el nuevo estándar.

Esto es tan importante para nosotros que estamos trabajando estrechamente con los organismos de normalización para garantizar nuestra implementación de componentes coincide con la hoja de ruta de la plataforma web.

También es importante tener en cuenta que una brasa .El componente es en realidad un Ember .Ver (una subclase) pero que está completamente aislado. El acceso a propiedades en sus plantillas va al objeto view y las acciones están dirigidas también al objeto view. No hay acceso al context o exterior circundante controller toda la información contextual se pasa en, que es no es el caso con una brasa .Vista que de hecho tiene acceso a su controlador circundante, por ejemplo, dentro de una vista podría hacer algo como this.get('controller') que le daría el controlador actualmente asociado con la vista.

Entonces, ¿cuál es la principal diferencia entre una vista y un componente?

Entonces, la principal diferencia además de que los componentes te permiten crear tus propias etiquetas y en algún momento en el futuro cuando Elementos Personalizados son disponible también migrar / usar esos componentes en otros frameworks que soportarán elementos personalizados, es de hecho que en algún momento un componente ember hará que una vista sea algo obsoleta dependiendo del caso de implementación específico.

¿Y cuál sería un ejemplo común donde preferiría usar una vista sobre un componente y viceversa?

Siguiendo lo anterior, esto depende claramente de sus casos de uso. Pero como regla general, si necesita en su vista el acceso a ella es controlador circundante, etc. utilice una brasa .View , pero si desea aislar la vista y pasar solo la información que necesita para funcionar, haciéndola independiente del contexto y mucho más reutilizable, use un Ember .Componente.

Espero que ayude.

Actualización

Con la publicación de Road to Ember 2.0 ahora se le anima a usar Componentes en lugar de Vistas en la mayoría de los casos.

 169
Author: intuitivepixel,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-01-12 14:16:13

La respuesta es simple: use componentes

De acuerdo con un video de entrenamiento que se grabó en agosto de 2013, Yehuda Kats y Tom Dale (miembros del Equipo Ember Core) le dijeron a la audiencia que no usara vistas a menos que sea un desarrollador de framework. Han hecho muchas mejoras en los Manillares y han introducido componentes, por lo que las vistas ya no son necesarias. Las vistas se usan internamente para alimentar cosas como {{#if}} y {{outlet}}.

Los componentes también imitan de cerca el Componente Web estándar que se construirá en el navegador, por lo que hay muchos beneficios secundarios para convertirse en componentes de brasa de construcción cómodos.

Actualización 2014-11-27

Ahora es aún más importante usar componentes en lugar de vistas, ya que Ember 2.0 usará Componentes enrutables cuando se ingrese una ruta, en lugar de un controlador/vista. Con el fin de preparar su aplicación para el futuro, lo mejor es mantenerse alejado de las vistas.

Fuentes:

 15
Author: Johnny Oshika,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-12-10 18:21:53

Tal como está ahora - v2.x siendo la versión estable actual - las vistas han sido completamente obsoletas. Se dice que las vistas se están eliminando de la API Ember 2.0.

Entonces, usar la palabra clave {{view}} en Ember 2.0 activará una aserción:

Aserción fallida: Usando {{view}} o cualquier ruta basada en ella ha sido eliminada en Ember 2.0

Si tienes que usar vistas en Ember 2.0 puedes usar el complemento ember-legacy-views , que será compatible con Ember hasta la versión 2.4.

Entonces, para resumir - los componentes son el presente (las vistas se eliminan) y el futuro - también reemplazarán a los controladores. Ver Componentes enrutables RFC.

 4
Author: Daniel Kmak,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-09-27 13:24:04