1
Проблема заключается в следующем, когда я обновляю attr, липкий либо в devtool, либо с помощью js-кода. Я не могу запустить атрибутChangedCallback. Метод _updateSticky() отлично работает при прокрутке, с добавлением и удалением липкого attr.attributeChangedCallback not firing
class HeaderLogo extends HTMLElement {
static get observedAttribute() {
return ['alt-logo', 'sticky'];
}
constructor() {
super();
}
connectedCallback() {
this._updateSticky();
window.addEventListener('scroll',() => {
this._updateSticky();
}, false);
}
attributeChangedCallback(attrName, oldVal, newVal) {
console.log("attr changed");
}
/* evaluates if the logo should be in sticky state or not */
_updateSticky() {
let scrollTop = window.pageYOffset || (document.documentElement || document.body.parentNode || document.body).scrollTop;
let breakpoint = 50;
if (scrollTop > breakpoint) {
this.setAttribute('sticky', '');
} else {
this.removeAttribute('sticky');
}
}
}
window.customElements.define('header-logo', HeaderLogo);
Спасибо diden't заметить, что один. Очень добрый. –