报错：RouteChildrenProps不是导出成员，该如何解决？

这个报错的核心原因是你当前使用的React Router v6和教程采用的旧版本（v5及以下）API不兼容：v6已经移除了RouteChildrenProps这个导出类型，同时Route组件的render、exact属性也被废弃。

具体解决步骤： #

• 移除RouteChildrenProps的导入和类型声明：v6中路由组件会自动接收路由相关props，无需手动指定该类型。
• 替换render属性为element：v6的Route组件用element字段指定要渲染的组件，不再支持render回调。
• 删除exact属性：v6中路由默认采用精确匹配规则，只有当路径末尾加*时才会模糊匹配，因此不需要手动设置exact。

修改后的完整代码： #

import React from 'react';
import { Route, Routes } from 'react-router';
import routes from './config/routes';

export interface IApplicationProps {}

const Application: React.FunctionComponent<IApplicationProps> = () => {
  return (
    <Routes>
      {routes.map((route, index) => {
        return (
          <Route 
            key={index} 
            path={route.path} 
            element={<route.component />} 
          />
        );
      })}
    </Routes>
  );
};

export default Application;

额外说明（若需类型约束）： #

如果需要给你的路由配置数组做类型定义，可以手动声明：

interface RouteConfig {
  path: string;
  component: React.ComponentType;
  // 可根据实际需求添加其他字段，比如路由元信息等
}

// 假设你的routes文件导出的是RouteConfig类型数组
const routes: RouteConfig[] = [/* 你的路由配置 */];

内容的提问来源于stack exchange，提问作者John Beasley