BrowserHistory不适用于反应路由器

乔希

目前,我的URL结构仍以哈希语法存储历史记录。
例如:http://localhost:3000/#/work?_k=otstr8

我试图browserHistory从react-router使用它来显示为:
http://localhost:3000/#/work

这是我的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;

我的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'))

根据我的研究,此语法是否正确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'));

该网址的语法现在为:
localhost:3000 /
localhost:3000 / work
localhost:3000 / resume

太好了!

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

反应路由器-NavLink activeStyle或activeClassName不适用于嵌套路由

反应路由器-带:id的路径不适用于HOC包装的组件

反应路由器 history.push() 不适用于 history.listen()

activeClassName不适用于可变路径的反应路由器

反应路由器 dom v-6 不适用于构建版本

转换不适用于 SwiftUI 中的路由器

查询参数不适用于ui路由器

Angular 2路由器辅助路由不适用于redirectTo

更新路由不适用于合并的Express路由器参数

Vue过渡不适用于具有可重用组件的路由器视图

角度6:路由器参数不适用于服务

路由器链接不适用于共享模块中的组件

Mule Munit测试用例不适用于APIKit路由器流

样式表不适用于使用chi路由器的go html模板

Traefik 2.0-路径路由器规则不适用于docker标签

路由器不适用于 Link(React Router Dom 6)

Django Viewset 检索不适用于默认路由器

默认插槽或命名插槽不适用于 Vue 3 中的“路由器视图”

我的快递路由器发帖请求不适用于邮递员

Express 路由器不适用于猫鼬。这是说用户未定义

Angular路由器:命名的插座似乎不适用于相对路由,也不适用于延迟加载的模块

Vue 路由器、GitHub 页面和自定义域不适用于路由链接

Angular-UI路由器嵌套视图不适用于某些移动浏览器

播放框架Javascript路由器不适用于其他目录中的控制器

React 路由器链接仅适用于刷新

适用于ASUS RT-N16的DD-WRT命令不适用于新路由器ASUS RT-AC68U

具有vue 2组件的vue路由器不适用于laravel 5.8

路由器angular2不适用于同一组件,但difefrenet ID

验证器不适用于 AdonisJS 中的资源路由