Problema con Jquery nel componente del plugin

Sviluppatore
1

jQuery è abilitato automaticamente per i componenti dei plugin? Sto saltando qualche passaggio di configurazione?

Sto riscontrando problemi nel semplice accesso al DOM HTML tramite jQuery (con l’obiettivo finale di utilizzare la funzione autocomplete di jQuery). Ecco un esempio di uno dei miei tentativi, volto a recuperare l’ID di un elemento utilizzando il suo ID. Non riesce mai a trovare l’elemento. È come se il JavaScript non avesse un punto di riferimento.

---- in /src/plugins/test/assets/javascripts/discourse/components ----
---- element-main.js.es6 ----
import discourseComputed, { observes } from “discourse-common/utils/decorators”;
import jQuery from ‘jquery’;

export default Ember.Component.extend({
init() {
this._super(…arguments);
console.log(“in the templates/components/element-main.js.es6”);
console.log(jQuery);
const aaa = jQuery(‘#eleinp’);
console.log(aaa)
console.log(aaa.attr(‘id’));
}
});

---- in /src/plugins/test/assets/javascripts/discourse/templates/components ----
---- element-main.hbs ----

element-main in temp

Ho provato anche this.element, (this.element), (this), $(), ecc.

2

init è troppo presto nel ciclo di vita per applicare jQuery. Inoltre, non hai bisogno di importarlo. Infine, devi valutare se hai VERAMENTE bisogno di usarlo fin dall’inizio. Se devi usarlo, didInsertElement o didRender sono i punti corretti per impiegarlo.

3

Grazie! didRender() ha funzionato bene, ho anche rimosso l’istruzione di importazione ridondante. Sto usando jQuery perché ho una query di ricerca personalizzata sull’input che non si integra bene con l’elemento HTML ‘datalist’. Questo perché datalist mostra le opzioni solo quando contengono esplicitamente una sottostringa.

4

Cerca di evitare jQuery, che verrà rimosso da Ember e quindi da Discourse nei prossimi due anni. Il JS moderno vanilla è sufficiente.

5

Grazie per l’avviso, sto guardando Awesomplete invece dell’autocomplete di JQuery ora