如何将悬念与React-Router-Dom V6使用？

Question

我正在尝试将React-Router-Dom从V5迁移到V6，并且遇到了麻烦，这是我使用悬挂

<Suspense
   fallback={
     <div className="center-div">
        <LoadingDots />
     </div>
   }
>
    <Routes>
        {routes.map((route, index) => (
           <Route
              path={route.path}
              key={route.path}
              element={lazy(() => import("./features/apps/AppsListPage"))} //it is route.component but for simplify example i'm show it like this
          />
        ))}
    </Routes>
</Suspense>

有人告诉我，有人可以告诉我为什么浏览器为什么浏览器返回我这种错误？

index.tsx:13 Error: Objects are not valid as a React child (found: object with keys {$$typeof, _payload, _init}). If you meant to render a collection of children, use an array instead.

我认为它是由element prop中使用懒惰引起的，但是我可以解决此问题吗？

感谢您的帮助！