时间戳

首页 > 解决方案 > TypeError：无法读取未定义的 React Framer Motion API 的属性“位置”

javascript - TypeError：无法读取未定义的 React Framer Motion API 的属性“位置”

问题描述

当我尝试使用 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;

标签： javascriptreactjs

解决方案

访问 useEffect() 挂钩中的“位置”对象并将其设置为状态（使用 useState()），然后您将能够访问该对象内的所有属性。

有关更多详细信息，请访问以下链接： https ://reactrouter.com/web/api/Hooks/uselocation

推荐阅读