未捕获的类型错误：（0，react_router_dom__WEBPACK_IMPORTED_MODULE_2__.useHistory）不是函数（React.js）

Question

我使用React Router Version 6然后运行下面的代码：

import { useHistory } from 'react-router-dom'

function Test() {
  const history = useHistory();
  history.push('/');
  history.replace('/');
  history.goBack();
}

Test();

但我收到了这个错误：

未捕获的类型错误：（0，react_router_dom__WEBPACK_IMPORTED_MODULE_2__.useHistory）不是函数

我的代码有什么错误吗？

Answer 1

对于React Router Version 6，使用“useNavigate”而不是React Router Version 5的“useHistory”。

因此，替换您的代码（React Router Version 5）：

import { useHistory } from 'react-router-dom'

function Test() {
  const history = useHistory();
  history.push('/');
  history.replace('/');
  history.goBack();
}

Test();

使用此代码（React Router Version 6）：

import { useNavigate } from 'react-router-dom'

function Test() {
  const navigate = useNavigate();
  navigate('/');                    // Equivalent to "history.push('/');"
  navigate('/', { replace: true }); // Equivalent to "history.replace('/');"
  navigate(-1);                     // Equivalent to "history.goBack();"
}

Test();