Реагировать маршрутизатор не показывая маршрут соответствует пути, даже если маршрут существует

Question

Я пытаюсь использовать реагировать-маршрутизатор для создания маршрутов для моих страниц, но я всегда получаю следующее сообщение об ошибке

**Warning: No route matches path "/profile/". Make sure you have <Route path="/profile/"> somewhere in your routes app.js:34** 

Это то, что мой код выглядит как

var React = require('react'); 
var Router = require('react-router'); 
var Home = require('./home.js'); 
var ChallengesPage = require('./challengespage.js'); 
var ProfilePage = require('./profilepage.js'); 
var LoggedInPage = require('./loggedinpage.js'); 


var Route = Router.Route; 
var RouteHandler = Router.RouteHandler; 
var DefaultRoute = Router.DefaultRoute; 
var RouteHandler = Router.RouteHandler; 

var App = React.createClass({ 
    render:function() { 
     return(<div> 

     </div>); 
    } 
}); 

var routes = (
       <Route handler={App} path="/">  
       <DefaultRoute handler={Home} /> 
       <Route name="profile" handler={LoggedInPage} />  
       <Route name="dashboard" handler={ProfilePage} />  
       <Route name="challenges" handler={ChallengesPage} />  
       </Route> 
); 


Router.run(routes, function (Handler) { 
    React.render(<Handler/>, document.getElementById('app')); 
}); 

Это то, что работает для меня, я отправляю это только в случае, если кто-то сталкивается с той же проблемой,

var Route = Router.Route; 
var RouteHandler = Router.RouteHandler; 
var DefaultRoute = Router.DefaultRoute; 
var RouteHandler = Router.RouteHandler; 

var App = React.createClass({ 
    render:function() { 
     return(<div> 
     <RouteHandler/> 
     </div>); 
    } 
}); 

var routes = (
       <Route handler={App} path="/">  
       <DefaultRoute handler={Home} /> 
       <Route path="loggedin/" name="loggedin" handler={LoggedInPage} />  
       <Route path="dashboard/" name="dashboard" handler={ProfilePage} />  
       <Route path="challenges/" name="challenges" handler={ChallengesPage} />  
       </Route> 
); 


Router.run(routes, Router.HistoryLocation, function (Handler) { 
    React.render(<Handler/>, document.getElementById('app')); 
}); 

Также укажите маршруты URL-адресов в бэкэнде.

Answer 1

необходимо установить путь по вашим маршрутам. В настоящее время все ваши маршруты сопоставляются '/'

var routes = (
     <Route handler={App} path="/">  
      <DefaultRoute handler={Home} /> 
      <Route path="/profile/" name="profile" handler={LoggedInPage} />  
      <Route path="/dashboard/" name="dashboard" handler={ProfilePage} />  
      <Route path="/challenges/" name="challenges" handler={ChallengesPage} />  
     </Route> 
); 

Кроме того, необходимо добавить компонент в приложение, так что ваш ребенок маршруты могут быть заменены на него.

var App = React.createClass({ 
    render:function() { 
     return(<div> 
      <Router.RouteHandler/> 
     </div>); 
    } 
});