相关疑难解决方法(0)

随着react-router我可以使用Link元素创建的原生处理反应路由器链接.

我看到内部调用this.context.transitionTo(...).

我想进行导航,但不是从链接,例如下拉选择.我怎么能在代码中这样做？什么是this.context？

我看到了Navigationmixin,但是我可以不用mixin吗？

我对 React 非常陌生，第一次尝试通过将其推送到历史记录来实现到新页面的导航，但现在我在这个错误上Cannot read property 'push' of undefined for react use history停留了几个小时，我认为我需要一些帮助或指导。

这是我的小型 mvp 组件（我正在使用 Hooks）：

import React, {useEffect, useState} from 'react';
import {BrowserRouter as Router, Route, Switch, useHistory} from "react-router-dom";
import Report from "./components/Report";

function App() {

let history = useHistory();

function handleClick() {
    history.push("/report");
}

return (
    <Router>
        <Route path="/report" component={Report}/>
        <div>
            <button onClick={handleClick}>Click me</button>
        </div>

    </Router>
);
}

export default App

和

import React from "react";
import {withRouter} from "react-router-dom";

const …

我正在使用几个星期前发布的React Router的新useHistory挂钩。我的React-router版本是5.1.2。我的React版本为16.10.1。您可以在底部找到我的代码。

但是，当我从react-router导入新的useHistory时，出现此错误：

Uncaught TypeError: Cannot read property 'history' of undefined

这是由React-router中的这一行引起的

function useHistory() {
  if (process.env.NODE_ENV !== "production") {
    !(typeof useContext === "function") ? process.env.NODE_ENV !== "production" ? invariant(false, "You must use React >= 16.8 in order to use useHistory()") : invariant(false) : void 0;
  }

  return useContext(context).history; <---------------- ERROR IS ON THIS LINE !!!!!!!!!!!!!!!!!
}

由于它与useContext有关，并且可能与上下文冲突有问题，因此我尝试完全删除对useContext的所有调用，创建提供程序等。但是，此操作无济于事。试过React v16.8; 一样。我不知道是什么原因造成的，因为React路由器的所有其他功能都可以正常工作。

***请注意，调用其他React路由器挂钩（例如useLocation或useParams）时，也会发生相同的情况。

有人遇到过这种情况么？有什么想法可能导致这种情况吗？任何帮助将不胜感激，因为我在网上没有找到与此问题相关的信息。

import React, {useEffect, useContext} from 'react';
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
import { …