Ich bin neu bei ReactJs. Das ist mein Code:
var React = require('react');
var ReactDOM = require('react-dom');
var {Route, Router, IndexRoute, hashHistory} = require('react-router');
var Main = require('Main');
ReactDOM.render(
<Router history={hashHistory}>
<Route path="/" component={Main}></Route>
</Router>, document.getElementById('app'));
und kompilieren Sie es mit Webpack. Außerdem habe ich meinen Aliasnamen die Hauptkomponente hinzugefügt. Die Konsole gibt folgende Fehler aus: Ich habe auch diese Links gelesen:
React Router fehlgeschlagen Prop 'Verlauf', ist undefiniert
Wie löse ich, dass der Verlauf als erforderlich markiert ist, wenn der Wert nicht definiert ist?
Aktualisieren von React-Router und Ersetzen von hashHistory durch browserHistory
und viele Suchanfragen im Internet, aber ich konnte dieses Problem nicht beheben. React Router ist Version 4
quelle
<Route...>
Anweisungen in einen<switch>
Wrapper einbinden, anstatt sie einzuschließen<div>
. Wenn Sie<div>
diese Option verwenden, werden die Routen eingeschlossen. Wenn ein Pfad zwei Routen entsprechen kann, werden beide Komponenten gerendert. AlleWelche Version von React Router verwenden Sie? Router Version 4 wurde von der Übergabe der browserHistory-Klasse auf die Übergabe einer Instanz von browserHistory geändert. Weitere Informationen finden Sie im Codebeispiel in den neuen Dokumenten .
Dies hat viele Leute gefangen, die automatisch upgraden; Ein Migrationsdokument wird "jeden Tag" veröffentlicht.
Sie möchten dies oben hinzufügen:
und
quelle
customHistory
definiert?Wenn Sie mehrere Routen haben möchten, können Sie den Schalter wie folgt verwenden:
dann
quelle
Ich habe das gleiche Problem in ES6, aber als ich auf die Bibliothek 'react-router-dom' umgestiegen bin, wurde das Problem gelöst. Für alle Fans von ES6 geht es los:
npm install --save react-router-dom
In index.js:
quelle
In index.js:
oderIn index.jsx:
?Version 4 von React Router hat einige Dinge geändert. Sie erstellten separate Router-Elemente der obersten Ebene für die verschiedenen Verlaufstypen. Wenn Sie mit der Version 4 sollten Sie in der Lage sein , zu ersetzen ,
<Router history={hashHistory}>
mit<HashRouter>
oder<BrowserRouter>
.Weitere Informationen finden Sie unter https://reacttraining.com/react-router/web/guides
quelle
Ich schreibe auch eine Login-Praxis. Und auch die gleiche Frage wie Sie. Nach einem Tag Kampf fand ich, dass nur es schaffen
this.props.history.push('/list/')
kann, anstatt viele Plugins zu ziehen. Diereact-router-dom
Version ist übrigens^4.2.2
. Vielen Dank!quelle
Das Folgende funktioniert bei mir mit "react-router@^3.0.5":
package.json:
index.js:
quelle