La route Reactjs ne renvoie pas le bon résultat

Question

J'ai 3 applications avec cette structure :

import React from 'react'
export default React.createClass({
    render() {
        return <div>Hey App1!</div>
    }
})

import React from 'react'
export default React.createClass({
    render() {
        return <div>Hey App2!</div>
    }
})

import React from 'react'
export default React.createClass({
    render() {
        return <div>Hey App3!</div>
    }
})

Et dans mon main.js :

import React from 'react'
import ReactDOM from 'react-dom'
import {Router, Route, browserHistory, IndexRoute } from 'react-router'
import App1 from './modules/App1.js'
import App2 from './modules/App2.js'
import App3 from './modules/App3.js'

ReactDOM.render((
  <Router history={browserHistory}>
    <Route path="/" component={App1}>
      <IndexRoute component={App1} />
      <Route path="app1" component={App2} />
      <Route path="app2" component={App3} />
    </Route>
  </Router>
), document.getElementById('app'))

Mais quand j'essaie /#/app1 o /#/app2 dans mon navigateur, l'adresse / (cela signifie "Hey App1").

Ma version de Reactjs est : 15.3.2

Answer 1

Votre histoire préférée est browserHistory . Les URLs devraient alors ressembler à example.com/some/path .

Essayez donc /app1 o /app2 sans hachage dans l'url.

L'historique des hachages utilise la partie hachée (#) de l'URL, créant ainsi des routes qui ressemblent à exemple.com/#/some/path.

Si vous voulez utiliser le hash dans l'url, passez le code suivant hashHistory comme accessoires au lieu de browserHistory