Question

我已经在我的类构造函数中创建了一个空数组this.contentElements作为全局变量，但是当我尝试从一种方法将对象推入该数组时，出现错误'Cannot read property 'push' of undefined'。我无法弄清楚为什么它不起作用。

当我将数组记录到构造函数内部时，它返回空数组，但是当我尝试将其记录到方法内部时，它返回未定义。

我也尝试使用箭头函数表达式来绑定方法，成功为0。

export class Intro {

 constructor() {
    this.createTimeline();
    this.contentElements = []; 
 }

  createTimeline() {
    const contentArray = Array.from(document.querySelector('.intro-overlay').querySelectorAll('.content'));  

   contentArray.map(content => {
     const contentEl = content;
     const contentBounds = contentEl.getBoundingClientRect();
     const contentTop = contentBounds.top;

     this.contentElements.push({
       el: contentEl,
       top: contentTop
     })

     console.log(this.contentElements)
   });
  }
}

Answer 1

在构造函数中，需要在调用this.createTimeline（）之前将空数组分配给this.contentElements。

Answer 2

更改构造函数中的顺序

contentElements必须先初始化，然后才能使用

export class Intro {

 constructor() {
    this.contentElements = [];
    this.createTimeline();
 }

  createTimeline() {
    const contentArray = Array.from(document.querySelector('.intro- 
    overlay').querySelectorAll('.content'));  

   contentArray.map(content => {
     const contentEl = content;
     const contentBounds = contentEl.getBoundingClientRect();
     const contentTop = contentBounds.top;

     this.contentElements.push({
       el: contentEl,
       top: contentTop
     })

     console.log(this.contentElements)
   });
  }
}

ES6类：全局变量在类方法内部未定义

2 个答案: