不是一個函數錯誤 - JavaScript的ES6類結構

Question

有問題 - 沒有功能的錯誤，我的代碼，這就是：

import $ from 'jquery'; 
import gsap from 'greensock'; 

class IntroAnimations{ 
constructor(){ 
    this.ctaEnter   = $('#cta-enter'); 
    this.loadContent  = $('.center-h-v'); 
    this.tlLoading  = new TimelineLite(); 
    this.animationTime = .5; 

    this.ctaEnter.click(function(){ 
     this.removeLoadContent(); //<- error is here 
    }) 
} 
removeLoadContent(){ 
    TweenLite.to(this.loadContent, this.animationTime, {autoAlpha: 0}) 
} 
} 

export default IntroAnimations; 

錯誤是，當我打電話this.removeLoadContent（）; 有人可以幫我解釋爲什麼這會導致錯誤？

謝謝。

Answer 1

這是因爲「this」有不同的上下文。

使用胖箭頭寫你的功能，它應該工作。

removeLoadContent =()=>{ 
    TweenLite.to(this.loadContent, this.animationTime, {autoAlpha: 0}) 
} 

Answer 2

this.ctaEnter.click(() => { 
    this.removeLoadContent(); //<- error was here 
})