プラグインコンポーネントでの jQuery の問題

開発
1

jQueryはプラグインコンポーネントで自動的に有効になりますか？何か設定手順を見落としているのでしょうか？

jQueryを介してHTML DOMにアクセスするだけで問題が発生しています（最終的な目標はjQueryのautocomplete関数を使用することです）。ここでは、要素のIDを取得しようとした試みの一例を示します。しかし、要素が見つかりません。まるでJavaScriptに参照点が存在しないかのようです。

---- /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'));
  }
});

---- /src/plugins/test/assets/javascripts/discourse/templates/components 内 ----
---- element-main.hbs ----
<p>element-main in temp</p>
<input id="eleinp" value="HAHAHA">

this.element、(this.element)、(this)、$() なども試しました。

2

init は、jQuery を適用するにはライフサイクルが早すぎます。また、インポートする必要もありません。最後に、本当に jQuery を使用する必要があるかどうかを評価する必要があります。使用する必要がある場合は、didInsertElement または didRender がそれを使用する正しい場所です。

3

ありがとうございます！didRender() はうまく機能しました。また、重複するインポート文も削除しました。カスタム検索ステートメントが入力にあり、‘datalist’ HTML 要素と相性が悪いため、jQuery を使用しています。これは、datalist が明示的に部分文字列を含むオプションのみを表示するためです。

4

jQueryの使用は避けることをお勧めします。EmberおよびDiscourseから今後2年以内に削除される予定です。最新のバニラJavaScriptで十分です。

5

教えてくれてありがとう。今は JQuery の autocomplete ではなく、Awesomplete を検討しています。