reactjs - react typescript : Property 'history' does not exist on type 'PropsInterface'

Question

如果对数据库的调用失败，我尝试使用 props.history.push('/'); 进行重定向。但我收到错误 Property 'history' does not exist on type 'PropsInterface'为了进一步混淆事情，我已经从父级传递了 props 并将它们定义在 PropsInterface 中我如何扩展此接口(interface)以允许历史记录

import React, { useContext, useEffect } from 'react';
import { RouteProps } from 'react-router';
import { RouteComponentProps } from 'react-router-dom';
import { Global } from '../globalState';
import { Dispatch, SET_SHARED } from '../globalState';


interface PropsInterface {
  location: RouteProps['location'];
  children: RouteProps['children'];
}

const Layout: React.FC<PropsInterface> = (props: PropsInterface) => {
  const { global } = useContext(Global);
  const { dispatch } = useContext(Dispatch);

  useEffect(() => {
    const callApi = async (path: string) => {
...
        if (response.status === 200) {
          localStorage.setItem('jwtToken', content.jwtToken);
          dispatch({ type: SET_SHARED, value: content.shared });
        } else {
          localStorage.clear();
          props.history.push('/');
//                ^
//                 Property 'history' does not exist on type 'PropsInterface'.ts(2339)
        }
      }
    };

Answer 1

此处 PropsInterface 无法访问历史记录。因此，要掌握历史记录，您需要使用 withRoutes() 提供的 RouteComponentProps

修改您的代码，如下所示:

interface PropsInterface extends RouteComponentProps<any> {}

希望这有帮助。