如何从mapstatetoprops访问react路由器匹配对象

在React中，使用mapStateToProps函数可以将Redux store中的状态映射到组件的props上。然而，mapStateToProps函数本身并不能直接访问React路由器的匹配对象。要从mapStateToProps中访问路由器匹配对象，可以使用react-router-redux库提供的routerReducer和routerMiddleware。

以下是一种实现方法：

1. 首先，确保已经安装了react-router-redux库。
2. 在根级的reducer文件中，导入routerReducer并将其合并到根级reducer中。

import { combineReducers } from 'redux';
import { routerReducer } from 'react-router-redux';

const rootReducer = combineReducers({
  // 其他的reducer
  router: routerReducer
});

export default rootReducer;

1. 在Redux的store配置中，使用routerMiddleware来监听路由变化并将其同步到Redux store中。

import { createStore, applyMiddleware } from 'redux';
import { routerMiddleware } from 'react-router-redux';
import { createBrowserHistory } from 'history';
import rootReducer from './reducers';

const history = createBrowserHistory();
const middleware = routerMiddleware(history);

const store = createStore(
  rootReducer,
  applyMiddleware(middleware)
);

export default store;

1. 现在，你可以在mapStateToProps函数中访问路由器匹配对象了。通过state.router可以获取到路由器的相关信息，例如当前路径、路由参数等。

const mapStateToProps = state => {
  const { location, match, history } = state.router;
  // 使用location、match、history进行相关操作
  // ...
  return {
    // 将相关数据映射到组件的props上
  };
};

需要注意的是，以上方法是使用react-router-redux库来实现的。如果你正在使用其他的路由库，可能需要按照相应的方法进行操作。

推荐的腾讯云相关产品和产品介绍链接地址：

• 腾讯云产品：https://cloud.tencent.com/product
• 腾讯云服务器CVM：https://cloud.tencent.com/product/cvm
• 腾讯云对象存储COS：https://cloud.tencent.com/product/cos
• 腾讯云数据库MySQL：https://cloud.tencent.com/product/cdb_mysql
• 腾讯云容器服务TKE：https://cloud.tencent.com/product/tke
• 腾讯云人工智能AI：https://cloud.tencent.com/product/ai
• 腾讯云物联网IoT Hub：https://cloud.tencent.com/product/iothub
• 腾讯云云原生Serverless架构SCF：https://cloud.tencent.com/product/scf