el código que muestra la pantalla en blanco, incluso sin mostrar el encabezado y el pie de página. pero cuando elimino un código en la etiqueta de ruta, aparece el encabezado y el pie de página.
<><BrowserRouter> <Header title="My Todos List" searchBar={false} /> <Routes> <Route exact path="/" render={() => { return ( <> <Addtodo addTodo={addTodo} /> <Todos todos={todos} onDelete={onDelete} /> </>) }}> </Route> <Route exact path="/about"> <About /> </Route> </Routes> <Footer /> </BrowserRouter> </>Parece que está mezclando la API Route react-router-dom v5 mientras usa v6. El componente Route no toma un component ni render accesorios, y solo otros componentes Route pueden ser elementos secundarios de una Route . Ahora toman solo un accesorio de element que toma un ReactElement, también conocido como JSX. También se ha ido el accesorio exact . En RRDv6, las rutas ahora siempre coinciden exactamente.
<BrowserRouter> <Header title="My Todos List" searchBar={false} /> <Routes> <Route path="/" element={( <> <Addtodo addTodo={addTodo} /> <Todos todos={todos} onDelete={onDelete} /> </> )} /> <Route path="/about" element={<About />} /> </Routes> <Footer /> </BrowserRouter>También me he encontrado con problemas similares a los tuyos antes. ¿El contenido del enrutamiento bloquea el encabezado y el pie de página? puedes cambiar el estilo de diseño