Как изменить функцию лайка в конструкторе класса

Рейтинг: 0Ответов: 0Опубликовано: 11.01.2023

Вместо того, чтобы брать элемент лайка из события, можно определить свойство, в котором будет храниться кнопка. Причем определить нужно в методе, который вызывается единожды в течение жизни экземпляра класса(от его создания до уничтожения), чтобы поиск не производится при каждой обработке события:

Подскажите, пожалуйста, как это реализовать на моем проекте, я новичок и запуталась.

Пример.

someMethod1() {
   this._element = document.querySelector(...);
}

someMethod2() {
   // использование элемента из this._element
}


   class Card {
     constructor(data, templateSelector, openImagePopup) { // Передаю данные в виде объекта, а в самом классе присвоить полям нужные свойства:
       this._name = data.name;
       this._link = data.link;
       this._openImagePopup = openImagePopup;
       this._templateSelector = templateSelector,'#card__template';
     }


     /** Получить нужную разметку */
     _getTemplateCard() {
       const cardElement = document
         .querySelector(this._templateSelector)
         .content
         .querySelector('.element')
         .cloneNode(true); // Клонирую элемент

       return cardElement; // Возвращаю разметку карточки
     }
     
     
   /// Не получается сделать, все окрашивается в черный цвет///
     // _likeButton(like) {
     //   this._element = document.querySelector(like, '.element__like');
     // }
     // _handleLikeButton(like) {
     //   like.this._element.classList.toggle('element__like_active');
     //   }
     /////////////
     
     
     /** Навешиваю слушатель события */
     _setEventListeners() {
       const deleteCard = this._element.querySelector('.element__delete');
       deleteCard.addEventListener('click', () => this._handleDeleteButton())

       const likeCard = this._element.querySelector('.element__like');
       likeCard.addEventListener('click', (evt) => this._handleLikeButton(evt))
     }


    generateCard() {
       // Запишем разметку в приватное поле _element. 
       // Так у других элементов появится доступ к ней.
       this._element = this._getTemplateCard();
       this._setData();
       this._setEventListeners();

       return this._element;
     }
   }


Ответы

Ответов пока нет.