Esta es la primera vez que uso React y necesito ayuda. Tengo un componente TextEditor y un componente Navbar en mi clase App.js. Estoy tratando de que ambos se muestren en mi página, pero solo veo el componente TextEditor. Cuando se elimina este componente, puedo ver el componente Navbar. ¿Cómo puedo ver ambos componentes en mi página?
class App extends Component { render() { return ( <Router> <div className="App"> <Switch> {/* Navbar */} <Route exact path="/" component={Navbar} /> <Navbar bg="light" expand="sm"/> {/* Home page */} <Route path="/" exact> <Redirect to={`/documents/${uuidV4()}`} /> </Route> {/* TextEditor */} <Route path="/documents/:id" component={TextEditor}> <TextEditor /> </Route> </Switch> </div> </Router> ) } }pruebe este código, agregue este encabezado en cada página con el componente Navbar fuera de Switch
class App extends Component { render() { return ( <Router> <div className="App"> {/* Navbar */} <Navbar bg="light" expand="sm"/> <Switch> {/* Home page */} <Route exact path="/"> <Redirect to={`/documents/${uuidV4()}`} /> </Route> {/* TextEditor */} <Route path="/documents/:id" component={TextEditor}> <TextEditor /> </Route> </Switch> </div> </Router> ) } }o agregue el encabezado solo con el componente TextEditor en su lugar
class App extends Component { render() { return ( <Router> <Switch> {/* Home page */} <Route exact path="/"> <Redirect to={`/documents/${uuidV4()}`} /> </Route> {/* TextEditor */} <Route path="/documents/:id" component={TextEditor}> {/* Navbar */} <Navbar bg="light" expand="sm"/> <TextEditor /> </Route> </Switch> </Router> ) } }