ember.js - tutorial - ventajas de emberjs
Usando Ember.js, ¿cómo ejecuto algunos JS después de que se muestra una vista? (4)
¿Cómo ejecuto una función después de insertar una Ember View en el DOM?
Aquí está mi caso de uso: me gustaría usar la interfaz de usuario de jQuery para permitir la clasificación.
Debes didInsertElement
lo que quieras en la devolución de llamada didInsertElement
en tu Vista:
MyEmberApp.PostsIndexView = Ember.View.extend({
didInsertElement: function(){
// ''this'' refers to the view''s template element.
this.$(''table.has-datatable'').DataTable();
}
});
También puede usar el método afterRender
didInsertElement: function () {
Ember.run.scheduleOnce(''afterRender'', this, function () {
//Put your code here what you want to do after render of a view
});
}
didInsertElement
anular didInsertElement
como " didInsertElement
cuando el elemento de la vista se ha insertado en el DOM. Anule esta función para realizar cualquier configuración que requiera un elemento en el cuerpo del documento".
Dentro de la didInsertElement
llamada didInsertElement
, puede usar this.$()
Para obtener un objeto jQuery para el elemento de la vista.
Referencia: https://github.com/emberjs/ember.js/blob/master/packages/ember-views/lib/views/view.js
Ember 2.x: la vista está en desuso, use el componente en su lugar
Debe comprender el ciclo de vida del componente para saber cuándo ocurren ciertas cosas.
A medida que los componentes se procesan, se vuelven a renderizar y finalmente se eliminan, Ember proporciona ganchos de ciclo de vida que le permiten ejecutar código en momentos específicos de la vida de un componente.
https://guides.emberjs.com/v2.6.0/components/the-component-lifecycle/
En general, didInsertElement
es un gran lugar para integrarse con bibliotecas de terceros.
Este gancho garantiza dos (2) cosas,
- El elemento del componente ha sido creado e insertado en el DOM.
- El elemento del componente es accesible a través del método
$()
del componente.
En necesita JavaScript para ejecutar cada vez que cambian los atributos
Ejecute su código dentro del gancho didRender
.
Una vez más, lea la documentación del ciclo de vida anterior para obtener más información