“{}”类型中缺少属性“match”，但“IRouteParams”类型中需要属性“match”

Question

所以，我有这个旧项目，现在正在更新它，我有最后一个问题，有人知道如何解决这个问题吗？

import React from 'react';
import { Routes, Route} from 'react-router-dom';
import Layout from '../Components/Layout';

import Dashboard from '../Pages/Dashboard';
import List from '../Pages/List';

const AppRoutes: React.FC = () => (
    <div>
        <Routes>
            <Route path="/dashboard" element={<Dashboard/>} />
            <Route path="/list/:type" element={<List/>} />
        </Routes>
    </div>
);

export default AppRoutes;

有关列表的更多信息

const List: React.FC<IRouteParams> = ({ match }) 

interface IRouteParams {
    match: {
        params: {
            type: string;
        }
    }
};

Answer 1

React-Routrv6 删除了路线道具。

List

组件应通过 type

 钩子访问 

useParams 路由路径参数。

<Route path="/list/:type" element={<List/>} />

const List = () => {
  const { type } = useParam() as { type: string };

  ...
};