反応ルータ経由でクエリ文字列を渡す

Question

こんにちは私は反応ルータ経由でクエリ文字列を介して情報を渡そうとしていますが、アクセスできません。私はステップを正しくたどったが、まだ何もしていないと思う。

var UserContainer = React.createClass({ 
contextTypes: { 
    router: React.PropTypes.object.isRequired 
}, 
getInitialState: function() { 
    return{ 
     id: this.props.data.id, 
     username: this.props.data.username, 
     html_url: this.props.data.html_url, 
     avatar_url: this.props.data.avatar_url 
    } 
}, 
handleUserClick: function(event) { 
    event.preventDefault(); 

    var id = this.state.id; 
    var username = this.state.username; 
    var html_url = this.state.html_url; 
    var avatar_url = this.state.avatar_url; 

    this.context.router.push({ 
     pathname: '/user', 
     query: { 
      id: id, 
      username: username, 
      html_url: html_url, 
      avatar_url: avatar_url 
     } 
    }); 
}, 

//ROUTED TO THIS COMPONENT 

var React = require('react'); 

var UserShowView = React.createClass({ 
contextTypes: { 
    router: React.PropTypes.object.isRequired 
}, 
componentDidMount: function() { 
    console.log(this.props.location.query) 
}, 
render: function() { 
    return(
     <div> 
      Hello 
     </div> 
    ) 
} 
}); 

// REACT_ROUTER 

var React = require('react'); 
var ReactRouter = require('react-router'); 
var Router = ReactRouter.Router; 
var Route = ReactRouter.Route; 
var hashHistory = ReactRouter.hashHistory; 
var IndexRoute = ReactRouter.IndexRoute; 

var UsersIndexContainer = require('../containers/UsersIndexContainer'); 
var UserShowContainer = require('../containers/UserShowContainer'); 

var routes = (
    <Router history={hashHistory}> 
    <Route path='/' component={UsersIndexContainer} /> 
    <Route path='user' component={UserShowContainer} /> 
    </Router> 
); 

module.exports = routes; 

私はこのエラーに

を得続けるしかし、あなたが見ることができるようにクエリ文字列は、ルータの設定の問題のようですね

Answer 1

存在します。代わりに、同じレベルで、「/」と「ユーザー」を宣言するのは、「ユーザー」内部「/」以下のように埋め込みを行いたい：

var routes = (
    <Router history={hashHistory}> 
    <Route path='/' component={UsersIndexContainer}> 
     <Route path='user' component={UserShowContainer} /> 
    </Route> 
    </Router> 
); 

は、この試してみるとそれが助けなら、私に知らせてください。