J'utilise la dernière version de react-router
_ (version ^ 3.0.0).
J'ai écrit le routage suivant en utilisant ES5:
routes.js
:
var React = require("react");
var Router = require("react-router");
var AuthorPage = require('./components/authors/authorPage')
var App = require('./components/app')
var Route = Router.Route;
var routes = (
<Route path="/" component={App}>
<Route path="authors" component={AuthorPage}/>
</Route>
);
module.exports = routes;
Dans un autre fichier JS appelé main.js
J'effectue l'appel suivant:
main.js
:
var React= require("react");
var ReactDom = require("react-dom");
var Router = require('react-router').Router;
var routes = require('./routes');
ReactDom.render(<Router routes={routes}></Router>, document.getElementById('app'));
Lorsque j'exécute le code, l'exception suivante apparaît dans Google Chrome:
Uncaught TypeError: Impossible de lire la propriété 'getCurrentLocation' de undefined
Pourquoi donc? Qu'est-ce que je rate?
Vous ne transmettez pas une histoire à votre <Router>
.
Consultez le documentation d'histoires pour plus d'informations.
Avait la même erreur, résolu de cette façon:
Ajouter
var hashHistory = ReactRouter.hashHistory;
Et dans le routeur, l'historique est égal à hashHistory
<Router history={hashHistory}>
Donc dans votre cas:
var routes = (
<Router history={hashHistory}>
<Route path="/" component={App}>
<Route path="authors" component={AuthorPage}/>
</Route>
</Router>
);