Как изменить цвет изображения, фона и ссылок на панели навигации lo go? - PullRequest
Новая
       48

Как изменить цвет изображения, фона и ссылок на панели навигации lo go?

0 голосов
/ 28 мая 2020

У меня есть проект Preact, и я хочу изменить цвет фона навигационной панели, img sr c и цвет ссылок, когда я начинаю прокрутку вниз. Как я могу это сделать? Я новичок в Preact и меня немного смущает то, что я просто называю класс как class = {style.classname}. Спасибо за любую помощь.

1 Ответ

0 голосов
/ 11 июня 2020

Для события scroll вам нужно будет зарегистрироваться на объекте window, который является проблемой за пределами вашего компонента. Поэтому, если вы используете компонент на основе классов, вы можете использовать соответствующий обработчик обратного вызова или использовать useEffect хук для регистрации внешнего события при использовании функционального компонента.

Например, при использовании функционального компонента вы можете: 

import { h } from 'preact';
import { useEffect } from 'preact/hooks';

function function addEvent(node, eventName, callback) {

  node.addEventListener(eventName, callback);

  // Note the use of de-registration/unsubscribe function
  return () => node.removeEventListener(eventName, callback);
}


export function AppComp(props) {

  // The dependency array is empty since it doesn't depend on anything.
  useEffect(() => {
    const deregister = addEvent(window, 'scroll', () => {
      // Your logic on scroll.
    });

    // Remove the event subscription when component is destroyed
    return () => deregister();
  }, []);

  return (
    <div>Hello</div>
  );
}

Обратите внимание на использование функции addEvent. Он возвращает функцию отмены регистрации, которую можно использовать для удаления прикрепленного события, как правило, при уничтожении компонента, гарантируя отсутствие утечек памяти или нежелательного состояния.

...