错误：[ProxyFacade]不是&lt；Routing&>组件。&lt；Routs&>的所有组件子项必须是&lt；Routing&>或&lt；React.Fragment&>；

问题描述

我在Reaction 17中使用&reaction-router-dom"；："；6.0.2"；，并且我使用的是TypeScrip。我正在尝试添加路线。但出现错误

未捕获错误：[ProxyFacade]不是组件。的所有组件子项必须为或<；反应。碎片&>

我不知道是什么问题。我有什么遗漏的吗？

App.tsx

import * as React from "react";
import "./index.less";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import { hot } from "react-hot-loader";
import SignIn from "../sign-in";
import SignUp from "../sign-up";

const App = () => {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<SignIn />} />
        <Route path="/signup" element={<SignUp />} />
      </Routes>
    </BrowserRouter>
  );
};
declare let module: Record<string, unknown>;

export default hot(module)(App);

登录/index.tsx

import * as React from "react";
const SignIn = () => {
  return (
    <React.Fragment>
      <div>
        <p>Sign In</p>
      </div>
    </React.Fragment>
  );
};

export default SignIn;

注册/index.tsx

import * as React from "react";
const SignUp = () => {
  return (
    <React.Fragment>
      <div>
        <p>Sign In</p>
      </div>
    </React.Fragment>
  );
};

export default SignUp;

推荐答案

可能与Reaction热加载程序有关。热加载器使用代理包装所有内容[因此错误中的[ProxyFacade]]。React路由器代码可能会查看函数(组件)的类型，以验证Routes是否具有除Route组件之外的任何子组件。请参阅问题here。

您可以在没有热重载程序的情况下先尝试，看看您是否仍然面临这个问题。如果不这样做，则可以修复我在上面添加的链接中提到的Reaction热加载程序问题。

这篇关于错误：[ProxyFacade]不是&lt；Routing&>组件。&lt；Routs&>的所有组件子项必须是&lt；Routing&>或&lt；React.Fragment&>；的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！