React routing

.
< Index location= {location} >
{

        routes.map(r => {
          console.log(r)
            return(
              <Route
                key={r.path}
                exact
                path={r.path}
                component={r.component}
              />
            )
          }

}
< Index >
error Uncaught Error: Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children, use an array instead.

where routes= [
{path:"/ app/ui/buttons", component: () = > import (".. / components/buttons")},
{path:"/ app/ui/icons", component: () = > import (".. / components/icons")}
.
]

Thank you

May.10,2021

react does not support asynchronous components. It is recommended to use react-loadable this component.

import Loadable from 'react-loadable';

routes=[
    {
        path: '/app/ui/buttons',
        component: Loadable({
            loader: () => import('../components/buttons')
        })
    },
    {
        path: '/app/ui/icons',
        component: Loadable({
            loader: () => import('../components/icons')
        })
    }
]
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1beb8ec-307d1.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1beb8ec-307d1.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?