问将withRouter封装在ES7函数中

EN

import { StrictMode } from "react";
import ReactDOM from "react-dom";
import { BrowserRouter as Router } from "react-router-dom";
import App from "./App";

// for example I put it in the really beginning of the app
// you may change the placement of <Router />
ReactDOM.render(
  <StrictMode>
    <Router>
      <App />
    </Router>
  </StrictMode>,
document.getElementById("root")
);

import React from "react";
import details from "../../CSS/ProductsCss/details.css";
import { withRouter } from "react-router-dom";

function DetailProducts(props) {
  // you have access to following and even more things
  const { match, location, history } = props;

  return (
    <div className="single-product">
      
    </div>
  );
}

export default withRouter(DetailProducts)

import { useHistory } from "react-router-dom";

export default function DetailProducts() {
  const history = useHistory();

  function handleClick() {
    history.push("/some-path");
  }

  return (
    <div className="single-product">
      <button onClick={handleClick}>Click this</button>
    </div>
  );
}