[英]BrowserHistory not working for react-router
Currently my URL structure is still storing history in hash syntax. 目前我的URL结构仍然以哈希语法存储历史记录。
Ex: http://localhost:3000/#/work?_k=otstr8
例如:
http://localhost:3000/#/work?_k=otstr8
Im trying to have it use browserHistory
from react-router to be displayed as: 我试图让它使用来自react-router的
browserHistory
显示为:
http://localhost:3000/#/work
Here is my routes.js file: 这是我的routes.js文件:
//Import Dependencies.
import React from 'react';
import { Router, Route } from 'react-router'
import ReactDOM from 'react-dom';
//Import Components.
import AboutElement from '../views/about/about.jsx';
import WorkElement from '../views/work/work.jsx';
import ResumeElement from '../views/resume/resume.jsx';
//Set up routes.
let routes = (
<Router>
<Route path='/' component={AboutElement}/>
<Route path='/work' component={WorkElement}/>
<Route path='/resume' component={ResumeElement}/>
</Router>
);
export default routes;
My index.js file: 我的index.js文件:
//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('application'))
From what I have researched this syntax is correct for browserHistory
? 根据我的研究,这个语法对于
browserHistory
是否正确? For some reason hash history is still being used. 由于某些原因,哈希历史仍在使用中。 Any ideas why this is still happening?
任何想法为什么这仍然发生?
Just install history as a seperate library and use this. 只需将历史记录安装为单独的库并使用它。
import { createHistory } from 'history'
const history = createHistory()
Just created my own variable for browserHistory. 刚刚为browserHistory创建了我自己的变量。
//Import Dependencies.
import React from 'react';
import ReactDOM from 'react-dom';
import { Router } from 'react-router';
import createBrowserHistory from 'history/lib/createBrowserHistory';
const browserHistory = createBrowserHistory();
//Import Routes.
import routes from './routes/routes.js';
ReactDOM.render(<Router history={browserHistory} routes={routes} />, document.getElementById('application'));
The syntax for the url is now: url的语法现在是:
localhost:3000/ 本地主机:3000 /
localhost:3000/ work localhost:3000 / 工作
localhost:3000/ resume localhost:3000 / 简历
Which is great! 哪个好极了!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.