Неожиданное ключевое слово 'const' в componentDidMount, React

Question

Я пытаюсь создать липкий заголовок, получая элемент DOM и передавая ему функцию с помощью componentDidMount, но получаю сообщение об ошибке, что 'const' является ключевым словом Unexpected:

component:

class Header extends Component {

  componentDidMount(){
    window.addEventListener('scroll', () => {
      const isTop = window.scrollY > 100,
      const nav = document.getElementById('nav');
      if (isTop) {
        nav.classList.add('scrolled');
      }else {
        nav.classList.add('scrolled');
      }
    });
  }

  componentWillUnmount() {
    window.removeEventListener('scroll');
  }


  render() {
    return (<>
      <header>
        <nav class="nav" id="nav">
          <ul class="header-list">
            <li>
              <img alt='phone' src={phonelogo} />
            </li>
            <li>123456789</li>
          </ul>
          <ul class="header-list">
            <li>
              <img alt='email' src={email} />
            </li>
            <li>123@gmail.com</li>
          </ul>
        </nav>
      </header>
    </>)
  };
};


export default Header;

ошибка:

Line 17:7:  Parsing error: Unexpected keyword 'const'

  15 |     window.addEventListener('scroll', () => {
  16 |       const isTop = window.scrollY > 100,
> 17 |       const nav = document.getElementById('nav');
     |       ^
  18 |       if (isTop) {
  19 |         nav.classList.add('scrolled');
  20 |       }else {

Хотя, наверное, лучше использовать React refs, но все равно интересно, что здесь происходит.

Answer 1

Вы написали:

 const isTop = window.scrollY > 100,
 const nav = document.getElementById('nav');

Вам нужно заменить запятую на симиколон в конце строки 16. Вот так:

 const isTop = window.scrollY > 100;
 const nav = document.getElementById('nav');

Answer 2

Строка 16. Вы должны удалить запятую или заменить константу в строке 17