react中给一般组件添加路由组件独有的方法

在React中，要给普通组件添加路由组件独有的方法，你可以通过高阶组件（HOC）来实现。下面是一个简单的例子，演示如何给一个普通组件添加history和location对象作为属性的方法：

import React from 'react';
import { withRouter } from 'react-router-dom';
 
// 一个普通的组件
const MyComponent = props => {
  // 使用props.location和props.history
  return (
    <div>
      <p>当前路径：{props.location.pathname}</p>
      <button onClick={() => props.history.push('/other-path')}>跳转到其他页面</button>
    </div>
  );
};
 
// 高阶组件，注入路由属性
const MyComponentWithRouter = withRouter(MyComponent);
 
export default MyComponentWithRouter;

在上面的代码中，MyComponent是一个普通的React组件，它不包含history和location对象。通过使用withRouter高阶组件，我们可以将history对象和当前的location对象作为props传递给MyComponent，使其可以处理路由的程序化导航。

请确保你已经安装了react-router-dom，因为withRouter是从这个库中导出的。在你的应用中使用MyComponentWithRouter组件时，它将拥有路由相关的功能。