Question

我在浏览器地址栏中加上＃加上？_ k = qy3joe 作为查询字符串参数，例如http://localhost/#/login/?_k=qy3joe。它在生产中看起来不太好。如何用我的应用替换＃并删除 _k = qy3joe ？

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


var App = React.createClass({
  render: function(){
    return (
  <div>
  <h1>Welcome</h1>
    {this.props.children}
  </div>
);
}
});

var Login = React.createClass({
  render: function(){
    return (    
      <div className="large-3 medium-6 large-centered medium-centered columns"> 
        <h1>Login Page</h1>
      </div>

  ) }
});

ReactDOM.render((
  <Router>
    <Route path="/" component={App}>
      <Route path="login" component={Login}/>      
    </Route>
  </Router>
   ), document.getElementById('content'));

Answer 1

您需要使用以下内容设置路由器：

<Router history={createBrowserHistory()}>

这将为您提供类似http://www.example.com/my/path的网址，并使用HTML5历史记录API来维护位置状态，而不是查询密钥。

https://github.com/rackt/react-router/blob/master/docs/guides/basics/Histories.md#createbrowserhistory的“反应路由器”指南中介绍了各种历史记录的使用情况。

React Router 1.0 - 替换＃并摆脱？_k

1 个答案: