Ember Component句柄jQuery事件處理程序

Question

在Ember應用程序組件中，處理jQuery事件處理程序的最佳方法是什么？ 我想處理輸入元素上的keyUp事件。

Answer 1

didInsertElement將是進行jquery或dom相關操作的最佳場所。

didInsertElement（）也是附加事件偵聽器的好地方。 這對於自定義事件或其他沒有內置事件處理程序的瀏覽器事件特別有用。

https://guides.emberjs.com/v3.0.0/components/the-component-lifecycle/#toc_integrating-with-third-party-libraries-with-code-didinsertelement-code

編輯

我們不需要$(document).ready()因為那時文檔已經被加載了。 您可以全局或本地訪問dom元素。

您可以使用Ember.$()進行全局訪問，這與普通查詢類似，可用於選擇頁面上的任何元素。 即使來自另一個組件。

更好的（首選）方法是使用this.$()在本地訪問， this.$()方法僅適用於組件元素。

例如：

<h1 class="title">Heading 1</h1>
{{your-component}}

# your-component.hbs
<div> <h2>Component Heading 2</h2></div>

在上面的示例中，您可以使用Ember.$('h1')和Ember.$('h2')全局訪問didInsertElement內部的和標簽Ember.$('h2')

但是，如果您執行this.$('h1') ，它將返回null因為您的組件模板沒有h1標簽，並且退出的h1標簽位於您的組件之外。

簡而言之， Ember.$()行為就像常規的$()而this.$()行為就像Ember.$('your component root element').find()