Javascript React错误，在子级中使用Redux connect时发生，如何绕过？对象作为React子级无效

这里有一个错误：

对象作为React子对象无效（找到：具有键{$$typeof，type，compare，WrappedComponent}的对象）。如果要呈现子对象集合，请改用数组

如果我在main.js中不使用connect，并且在App.js中使用connect不会出错，那么它就可以正常工作，但是一旦我在main.js中使用connect，它就会抛出这个错误。我做错了什么？我使用的连接方式与App.js中的相同。谢谢

这是沙箱

您可以体验一下，只要删除main.js中的connect，它就会开始工作

App.js

import React, { useEffect } from "react";
import './styles/main.scss';
import './App.scss';

import routes from "./router/router";

import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import { connect } from "react-redux";

import {checkUser, fetchUsers, fetchPolls} from "./store/index";


function App (props) {
    useEffect(() => {
        let { loadUsers} = props
        loadUsers();
    }, [])

    let jsxRoutes = routes.map(el =>
        <Route
            path={el.url}
            exact={el.exact}
            key={el.url}>
            { el.component }
        </Route>
            )
    return (
            <Router>
                <div className="App">
                    <Switch>
                        { jsxRoutes }
                    </Switch>
                </div>
            </Router>
    );
}

const mapStateToProps = state => {
    return {
        users: state.users.data,
    }
}

const mapDispatchToProps = dispatch => {
    return {
        loadUsers: () => dispatch(fetchUsers())
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(App);

import React，{useffect}来自“React”；
导入“/styles/main.scss”；
导入“/App.scss”；
从“/router/router”导入路由；
从“react Router dom”导入{BrowserRouter as Router，Route，Switch}；
从“react redux”导入{connect}；
从“/store/index”导入{checkUser，fetchUsers，fetchPolls}；
功能应用程序（道具）{
useffect（（）=>{
让{loadUsers}=props
loadUsers（）；
}, [])
让jsxRoutes=routes.map（el=>
{el.component}
)
返回(
{jsxRoutes}
);
}
常量mapStateToProps=状态=>{
返回{
用户：state.users.data，
}
}
const mapDispatchToProps=调度=>{
返回{
loadUsers:（）=>dispatch（fetchUsers（））
}
}
导出默认连接（mapStateToProps、mapDispatchToProps）（应用程序）；

Main.js

import React from "react";
import "./main.scss"

import { connect } from "react-redux"


const Main = (props) => {
    return(
        <main>
            main pg
        </main>
    )
}



export default connect(null, null)(Main);

从“React”导入React；
导入“/main.scss”
从“react redux”导入{connect}
常量Main=（道具）=>{
返回(
主pg
)
}
导出默认连接（空，空）（主）；

在中尝试以下操作：

let jsxRoutes = routes.map((el) => (
  <Route path={el.url} exact={el.exact} key={el.url} component={el.component} />
));

让jsxRoutes=routes.map（（el）=>(
));

---

或者更简短的版本：

如果您没有在connect中传递

MapStateTrops

mapDispatchToProps

，那么您为什么还要调用

connect

。你可以直接在应用程序组件中使用主组件。我正在传递，但我删除了我传递的内容，所以更容易阅读。错误发生在我通过或不通过任何内容时。主要问题是我连接错了什么