Строка запроса URL-адреса ReactJS. BrowserHistory не работает

Question

У меня возникла проблема с тем, как агент-ретранслятор создает URL-адрес. В настоящее время URL дает мне эту структуру для страниц:

Root Компонент:
http://localhost:3000/#/?_k=24zils
Контакт Компонент:
http://localhost:3000/#/contact?_k=v12iev
О компоненте:
http://localhost:3000/#/about?_k=b22bqm

Я m tyring, чтобы отобразить их так:

корневой компонент:
http://localhost:3000/#/
Контактного Компонент:
http://localhost:3000/#/contact
О Компоненте:
http://localhost:3000/#/about

Я читал о browserHistory, который поддерживается среагировать-маршрутизатор. Он использует API истории, встроенный в браузер, для управления URL-адресом.

файл маршрутизатора:

//Import Dependencies. 
import React from 'react'; 
import { Router, Route } from 'react-router' 
import ReactDOM from 'react-dom'; 

//Import Components. 
import HomeElement from '../views/home/home.jsx'; 
import ContactElement from '../views/contact/contact.jsx'; 
import AboutElement from '../views/about/about.jsx'; 

//Set up routes. 
let routes = (
    <Router> 
     <Route path='/' component={HomeElement}/> 
     <Route path='/about' component={AboutElement}/> 
     <Route path='/contact' component={ContactElement}/> 
    </Router> 
); 

export default routes; 

Главный файл:

//Import Dependencies. 
import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { Router, browserHistory } from 'react-router' 

//Import Routes. 
import routes from './routes/routes.js'; 

ReactDOM.render(<Router history={browserHistory} routes={routes} />, document.getElementById('component-wrapper')); 

Я получаю ноль ошибок. Url по-прежнему структурирован с использованием параметра запроса. Любые идеи о том, что я делаю неправильно?

Сервер:

var webpack = require('webpack'); 
var WebpackDevServer = require('webpack-dev-server'); 
var config = require('./webpack.config'); 

new WebpackDevServer(webpack(config), { 
    publicPath: config.output.publicPath, 
    hot: true, 
    historyApiFallback: true 
}).listen(3000, 'localhost', function (err, result) { 
    if (err) { 
     console.log(err); 
    } 
    console.log('Listening at localhost:3000'); 
}); 

Answer 1

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

import React from 'react' 
import ReactDOM from 'react-dom' 
import { Router } from 'react-router' 
import createHistory from 'history/lib/createHashHistory' 

import routes from './routes/routes.js' 

var history = createHistory({ queryKey: false }) 

ReactDOM.render(
    <Router history={history} routes={routes} />, 
    document.getElementById('component-wrapper') 
) 

Более подробная информация об этом here