child route not working in single spa react app

I have created react app using single spa and in my navigation bar React app i am showing which will take me to route page (‘localhost;9000/react’). I need to see how child route will work, I have created child route but if i clicked on childroute my main url isnt working it should show localhost;9000/react/childroute but it was not showing. Below is the code.

//root.component.js

import React from 'react';
import {BrowserRouter as Router, Route, Switch, Link } from "react-router-dom";
import TestRoute from './TestRoute';
//import Reactapp from './Reactapp';
import ReactComponent from './ReactComponent';

export default function Root(props) {
  return (
    <Router baseName='/react'>
       <Switch>
          <Route path="/" component={ReactComponent} />  
          <Route path="/childroute" component={TestRoute} />  
       </Switch>
    </Router>
    
  )
}
//ReactComponent.js
import React from 'react';
import { Link } from 'react-router-dom';

const ReactComponent = () => {
    return(
        <div>
            ReactComponent
            <Link to='/childroute'>Child Route</Link>
        </div>
    )
}
export default ReactComponent;
//TestRoute.js

import React from 'react';

const TestRoute = () => {
    return(
        <div>
            TestPage
        </div>
    )
}
export default TestRoute;
//mf-demo-react.js

import React from "react";
import ReactDOM from "react-dom";
import singleSpaReact from "single-spa-react";
import Root from "./root.component";


const lifecycles = singleSpaReact({
  React,
  ReactDOM,
  rootComponent: Root,
  errorBoundary(err, info, props) {
    // Customize the root error boundary for your microfrontend here.
    return null;
  },
});

export const { bootstrap, mount, unmount } = lifecycles;