react路由传参问题

1. query传参

Route path='/query' component={Query}/>

this.props.history.push({pathname:"/query",query: { name : 'sunny' }});
读取参数用: this.props.location.query.name

• 优势：传参优雅，传递参数可传对象；
• 缺点：刷新地址栏，参数丢失

2.state传参

 
this.props.history.push({pathname:"/sort ",state : { name : 'sunny' }});
读取参数用: this.props.location.state.name

• 优缺点同query

3.search传参

 this.props.history.push("/user?id=123");
读取参数
let search = this.props.location.search;
        search = search.substr(1);
        let query = this.qs.parse(search);
        console.log(query);

• 优势 ： 刷新地址栏，参数依然存在
• 缺点:只能传字符串，并且，如果传的值太多的话，url会变得长而丑陋。