Search code examples
javascriptreactjstypescriptsettimeoutnext.js

TypeScript / ReactJS / setTimeout: 'this' implicitly has type 'any' because it does not have a type annotation.ts


In my NextJS/React typescript app I'm using a setTimeout.

There is a bug in React apps causing setTimeout's to get called instantly, which I then found a fix in this answer here: ReactJS: setTimeout() not working?

Below is my code, but I'm getting the following typescript error on the this on this.resetNotification

any 'this' implicitly has type 'any' because it does not have a type annotation.ts(2683) Board.tsx(158, 7): An outer value of 'this' is shadowed by this container.

@bind
resetNotification(): any {
  console.log('resetNotification...');
  this.setState({ notificationClass: 'spin-in-notification' });
  this.props.setNotification('', false);
}

@bind
private handleNotificationClick() {
  this.setState({ notificationClass: 'slide-out-bck-top' });

  setTimeout(
    function() {
      this.resetNotification();
    }
    .bind(this),
    500
  );
}

enter image description here


Solution

  • Do it with arrow function on setTimeout for heredate parents props

    setTimeout(
      () => {
      this.resetNotification();
      }......