React TypeScript: вызов функции при изменении маршрута с использованием response-router-dom

Question

Я ожидаю, что useEffect для консольного журнала, но проект не компилируется и выдает ошибку в терминале Unexpected use of 'location' no-restricted-globals Мне не нужно использовать useEffect, я был бы рад, если бы я мог заставить функцию запускаться каждый раз, когда местоположение меняется

import React, { useState, useEffect } from 'react';
import { BrowserRouter, Switch, Route } from 'react-router-dom';
import { CSSTransition, TransitionGroup } from 'react-transition-group'
import { Context } from "./components/context";
import { Layout } from "./components/layout";
import { Home } from './routes/home';
import { NotFound } from './routes/not-found';

const Router: React.FC = () => {

  useEffect(() => {
    console.log('location changed')
  }, [location]);

  return (
    <Context.Provider value={{ global, setGlobal }}>
      <BrowserRouter>
        <Route render={({location}) => ( //<-------- this is the location!!!
          <Layout>
            <TransitionGroup>
              <CSSTransition timeout={450} classNames='fade' key={location.key}>
                <Switch location={location}>
                  <Route exact path = '/' component = {Home} />
                  <Route exact path = '/my/profile/' component = {Home} />
                  <Route component = {NotFound}/>
                </Switch>
              </CSSTransition>
            </TransitionGroup>
          </Layout>
        )} />
      </BrowserRouter>
    </Context.Provider>
  );
}

export { Router };

Answer 1

Ошибка носит информативный характер.Вы нигде не объявляли имя переменной location.Если это глобальная переменная, вам нужно объявить следующим образом:

Filename: global.d.ts
declare var location: type