Почему не видно метода класса?

Question

[RLYamakasi]

Здравствуйте!
Внутри forEach JavaScript видит метода класса, который мне нужен.
Код:

export default class FormValidator {
  constructor(ValidationData, formElement){
    this.formSelector = ValidationData.formSelector;
    this.formLabel = ValidationData.formLabel;
    this.inputSelector = ValidationData.inputSelector;
    this.submitButtonSelector = ValidationData.submitButtonSelector;
    this.inactiveButtonClass = ValidationData.inactiveButtonClass;
    this.inputErrorClass = ValidationData.inputErrorClass;
    this.errorClass = ValidationData.errorClass;
    this.formElement = formElement;
    this.buttonElement = this.formElement.querySelector(
      this.submitButtonSelector
    );
    this.inputList = Array.from(
      this.formElement.querySelectorAll(this.inputSelector)
    );
  }

  checkInputValidity = (inputElement) => {
    if (!inputElement.validity.valid) {
      this.showInputError(formElement,inputElement,inputElement.validationMessage);
    } else {
      this.hideInputError(formElement,inputElement);
    }
    }; 

  showInputError = (formElement,inputElement,errorMessage) => { 
    const errorELement = formElement.querySelector(`#${inputElement.id}-error`);
    inputElement.classList.add(this.inputErrorClass);
    errorELement.textContent = errorMessage;
    errorELement.classList.add(this.errorClass);
  };

  hideInputError = (formElement,inputElement) => {
    const errorELement = formElement.querySelector(`#${inputElement.id}-error`);
    inputElement.classList.remove(this.inputErrorClass);
    errorELement.textContent = "";
    errorELement.classList.remove(this.errorClass);
  };

  hasInvalidInput = (inputList) => {
  return inputList.some((input) => !input.validity.valid);
  };
  
  toggleButtonState = (inputList,buttonsSubmit) => {
  if (this.hasInvalidInput(inputList)) {
    this.disableSubmitButton(buttonsSubmit);
  } else {
    buttonsSubmit.classList.remove(this.inactiveButtonClass);
    buttonsSubmit.disabled = false; 
  }
  };
  
  disableSubmitButton = (buttonsSubmit) =>{
    buttonsSubmit.classList.add(this.inactiveButtonClass);
    buttonsSubmit.disabled = true; 
  }
  
  setEventListener = (formElement) => {
    const inputList = Array.from(
      formElement.querySelectorAll(this.inputSelector)
    );
    const buttonsSubmit = formElement.querySelector( 
      this.submitButtonSelector 
    ); 

  this.toggleButtonState(inputList,buttonsSubmit);
  console.log(this.checkInputValidity)
  inputList.forEach((inputElement) => {
  inputElement.addEventListener("input", function() {
  this.toggleButtonState(inputList,buttonsSubmit);
  this.checkInputValidity(formElement,inputElement);
      
    });
  });
  };
  
   validation = () => {
    const formList = Array.from(
      document.querySelectorAll(this.formSelector)
    );
    formList.forEach((formElement) => {
      formElement.addEventListener("submit", (evt) => {
        evt.preventDefault();
      });
      this.setEventListener(formElement);
    });
}
}

Возникает ошибка this.toggleButtonState is not a function.
Подскажите пожалуйста, что я делаю не так и как это исправить!

Answer 1

[Alexandroppolus]

inputElement.addEventListener("input", function() {

Замени это на
inputElement.addEventListener("input", () => {
Должно попустить

Comments

[RLYamakasi]

спасибо большое, заработало!