如何在打字稿中调用 useHistory 函数答案

【问题标题】：how do I call useHistory function in typescript如何在打字稿中调用 useHistory 函数
【发布时间】：2021-05-28 10:16:11
【问题描述】：

import React from 'react';
import {Switch, Route, Redirect, useHistory} from 'react-router-dom';
import  {DashboardPage}  from './pages/Dashboard';
import {Sidebar} from './components/Sidebar'
import {Menu} from './components/Menu'
import { guilds } from './utils/mocks';

function App() {
  const history = useHistory;
  return (
    <div>
      <Sidebar guilds={guilds} />
      <Menu history={history} />
      <Switch>
        <Redirect path='/' exact={true} to="/dashboard" />
        <Route path="/dashboard" exact={true} component={DashboardPage} />
        <Route path="/dashboard/:guildId" exact={true} component={DashboardPage} />
        <Route path="/dashboard/:guildId/general/muted" exact={true} component={DashboardPage} />
        <Route path="/dashboard/:guildId/security/roles" exact={true} component={DashboardPage} />
      </Switch>
    </div>
  );
}

export default App;

类型“() => History”缺少类型“History”的以下属性：操作、位置、推送、替换等 6 个。 TS2740

11 |     <div>
12 |       <Sidebar guilds={guilds} />
13 |       <Menu history={history} />
   |                     ^
14 |       <Switch>
15 |         <Redirect path='/' exact={true} to="/dashboard" />
16 |         <Route path="/dashboard" exact={true} component={DashboardPage} />

你的意思是调用函数吗？

这是我在代码中遇到的错误

【问题讨论】：

标签： reactjs typescript

【解决方案1】：

要在 javascript 中执行（调用、调用）函数，您需要在其名称后使用一对括号。

function someFunctionA() {
 // implementation 
}

const someOtherFunctionB = function() { // implementation } 
// callsite

someFunctionA();
someOtherFunctionB();

【讨论】：

【解决方案2】：

我相信useHistory()是一个钩子，应该这样调用：

const history = useHistory();

不是

const history = useHistory;

让我知道它是否有效。

【讨论】：