ember 具有各种 id 的多个组件

Question

我在 ember 中有一个组件，我将其命名为 foo

import Ember from 'ember';
var data, elTop;
export default Ember.Component.extend({
  init(){
    this._super(...arguments);
  },
  didInsertElement(){
    this._super(...arguments);
    data = this.get('id');
    elTop = $('#'+data).offset().top;
    console.log(elTop);
  }
});

顺便说一句，我在父模板中使用了这个组件两次，每个组件的位置不同，但是为什么当 iam 控制台记录偏移量时，它的值相同。

谁能解释并解决它？我避免使用这个console.log($('#'+data).offset().top) 它的工作，但是当我使用滚动事件时会显示故障。

谢谢你:)

Answer 1

你需要在组件内部引入属性elTopdata。
您可以使用this.$ 访问组件dom

import Ember from 'ember';
export default Ember.Component.extend({
    data: '',
    elTop: '',
    didInsertElement() {
        this._super(...arguments);
        elTop = this.$().offset().top;
        console.log(elTop);
    }
});