Javascript 使用非React类中的React路由器
我的应用程序中有一个manager类,它只是一个普通的JS类,它是纯逻辑的,没有视图。我在我的几个组件中使用了它的一个实例。对于其中一个操作,我希望它在基于React的应用程序中更改路线。我知道我可以向每个组件返回一些东西,然后让组件执行路由,但是我想知道是否有一种方法可以从我的非react类执行路由。是否有一种方法可以通过历史对象并将新路径推送到它 谢谢你的帮助 编辑:这更多的是一个理论/方法问题,但例如: 经理级:Javascript 使用非React类中的React路由器,javascript,reactjs,react-router,Javascript,Reactjs,React Router,我的应用程序中有一个manager类,它只是一个普通的JS类,它是纯逻辑的,没有视图。我在我的几个组件中使用了它的一个实例。对于其中一个操作,我希望它在基于React的应用程序中更改路线。我知道我可以向每个组件返回一些东西,然后让组件执行路由,但是我想知道是否有一种方法可以从我的非react类执行路由。是否有一种方法可以通过历史对象并将新路径推送到它 谢谢你的帮助 编辑:这更多的是一个理论/方法问题,但例如: 经理级: class MyManagerClass { constructor()
class MyManagerClass {
constructor() {
this.data = {...some internal data};
}
doSomething(param) {
if(this.data[param]) {
this.data[param]();
} else {
//here i'd like to change the route in my react app
}
}
}
组成部分:
import React, {useContext, useEffect, useRef, useState} from "react";
const MyComponent = props => {
const myManagerClass = new MyManagerClass();
useEffect(() => {
myManagerClass.doSomething('param');
}, [props.something]);
return (
<div>Component</div>
)
}
import React,{useContext,useffect,useRef,useState}来自“React”;
常量MyComponent=props=>{
const myManagerClass=新的myManagerClass();
useffect(()=>{
myManagerClass.doSomething(“参数”);
},[props.某物];
返回(
组成部分
)
}
此问题至少有两种解决方案
解决方案1:
可以将历史对象作为组件的参数传递给操作
class Util {
static someAction(history) {
history.push('/someurl');
}
}
就这样说吧
const Comp = () => {
const history = useHistory();
const someHandler = () => {
Util.someAction(history);
}
...
}
解决方案2:
使用路由器的自定义历史记录,然后可以直接将历史记录导入类文件
history.js
import {createBrowserHistory} from 'history';
export const history = createBrowserHistory();
将其用于类似路由器的应用程序
import { Router } from 'react-router-dom';
import { history } from './path/to/history';
...
return (
<Router history={history}>{/* Routes here */}</Router>
)
请分享一些代码,以便人们能更好地理解。它更具理论性,但我添加了一个粗略的示例来说明我的问题。好的,谢谢。我想第二个解决方案就是我一直在寻找的。我以param的形式传入了history对象,但不喜欢它,因为我从很多地方传入了同一个对象。
import {history} from '/path/to/history';
class Util {
static someAction() {
history.push('/someurl');
}
}