首页 > 解决方案 > Typescript 不允许我在 BrowserRouter 中使用历史记录

问题描述

试验反应,我决定测试打字稿。

代码:

import { BrowserRouter } from 'react-router-dom'
import history  from './utilities/history'

ReactDOM.render(
  <BrowserRouter history={history}>
    <App />
  </BrowserRouter>,
  document.getElementById('root')
)

历史.js:

import { createBrowserHistory } from 'history'

export default createBrowserHistory()

错误:

类型'{孩子:元素;历史:历史;}' 不可分配给类型 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly & Readonly<{ children?: ReactNode; }>'。类型“IntrinsicAttributes & IntrinsicClassAttributes & Readonly & Readonly<{ children?: ReactNode; 上不存在属性“历史记录” }>'.ts(2322)

包.json:

@types/react-router-dom": "^4.3.4",
react-router-dom": "^5.0.1",

在没有打字稿的情况下做完全相同的事情时,代码就可以工作。我不明白为什么会发生这种情况,有人有答案吗?

标签: javascriptreactjstypescriptreact-router

解决方案


BrowserRouter不接受名为history. 见这里:https ://reacttraining.com/react-router/web/api/BrowserRouter 。有一个Router通用的低级接口,它有一个history道具,但它看起来不像BrowserRouter自己接受它。所以你可以考虑换成使用Router.

有关更多信息,请参阅此答案:https ://stackoverflow.com/a/45849608/10326373


推荐阅读