werde zu einer leeren Seite weitergeleitet wenn ich über react-router-dom zur neuen klasse leiten will

nikva

Bekanntes Mitglied
Hallo, ich versuche grade zu testen, wie ich in react zu einer neuen Klasse weiterleite aber erhalte nur eine leere weiße Seite wenn ich den Path /test eingebe. Es werden auch nicht die css Eigenschaften übernommen, was bedeudet, dass die Klasse nicht geladen wird. Hab auch schon das react-router-dom modul installiert aber das hat nichts geholfen. Hoffe hier hat jemand nen Tipp
Hier meine Klassen:
Javascript:
import logo from './logo.svg';
import './App.css';

export default function App() {
  return ( 
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}
Javascript:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import reportWebVitals from './reportWebVitals';
import Test from './components/test';
import { BrowserRouter, Route } from 'react-router-dom';
import Home from './App';

const routes = (
  <BrowserRouter>
    <div>
      <Route exact path='/' component={Home}></Route>
      <Route exact path='/teams' component={Test}></Route>
    </div>
  </BrowserRouter>
)


ReactDOM.render(
  routes,
  document.getElementById('root')
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
Javascript:
import './test.css';
import React, { Component } from 'react';

class Test extends React.Component {
  
 
  render() {
    return(
        <p>test</p>
    )
    }

}
export default Test
 

Neue Themen


Zurück
Oben