Добавить Scroll EventListener к документу в GatsbyJS (ReactJS)

Question

Как добавить следующий обработчик событий в функциональный компонент GatsbyJS (ReactJS)?

EventListener

document.addEventListener('scroll', _ => document.getElementById('logo').style.setProperty('--v-adjust', window.scrollY + 'px'))

Функциональный компонент

import React from 'react'
import { Link, useStaticQuery, graphql } from 'gatsby'

export default () => {
    //graphql statement
    return (
        <>...</>
    )
}

Answer 1

Мне понадобился хук useEffect для выполнения действия. Использование эффекта Hook

Обновленный компонент

import React, { useEffect } from 'react'

export default () => {
    useEffect(() => {
        document.addEventListener('scroll', _ => document.getElementById('logo').style.setProperty('--v-adjust', window.scrollY + 'px'))
    })
    return (
        <>...</>
    )
}