TypeError：無法讀取未定義的 React Framer Motion API 的屬性“位置”

Question

當我嘗試使用 useLocation() 時，出現此錯誤：TypeError：無法讀取未定義的屬性“位置”。 我怎樣才能解決這個問題？

import {BrowserRouter as Router, Switch, Route} from 'react-router-dom';
import {useLocation} from 'react-router-dom'
import home from './Components/home'
import about from './Components/about'
import work from './Components/work'
import contact from './Components/contact'
import NavbarHeader from './Components/navbarHeader';
import {AnimatePresence, motion} from 'framer-motion'

function App() {
  const location = useLocation();
  return (
    <Router>
      <AnimatePresence exitBeforeEnter>
      <NavbarHeader/>
        <Switch location= {location} key = {location.pathname}>
          <Route exact path='/' component={home}/>
          <Route path='/about' component={about}/>
          <Route path='/work' component={work}/>
          <Route path='/contact' component={contact}/>
        </Switch>
      </AnimatePresence>
      </Router>
  );
}

export default App;

Answer 1

在 useEffect() 掛鈎中訪問“位置”object 並將其設置為 state（使用 useState()），然后您將能夠訪問該 object 中的所有屬性。

有關詳細信息，請訪問以下鏈接： https://reactrouter.com/web/api/Hooks/uselocation