React Router 4是一个用于构建单页应用的React路由库,它提供了一种将组件与URL进行映射的方式。Redux Connect()是一个用于连接React组件与Redux状态管理库的函数。
在React Router 4的嵌套路由中,如果想要从Redux Connect()获取属性,需要确保Connect()函数包装的组件位于路由组件的内部。这样可以确保Connect()函数能够访问到Redux store中的状态,并将其作为属性传递给包装的组件。
以下是一种可能的解决方案:
import { connect } from 'react-redux';
import { Route } from 'react-router-dom';
const MyComponent = connect(mapStateToProps)(YourComponent);
class MyRouteComponent extends React.Component {
render() {
return (
<div>
{/* 其他路由组件内容 */}
<Route path="/nested" render={() => <MyComponent />} />
</div>
);
}
}
const mapStateToProps = (state) => {
return {
myProperty: state.myProperty
};
};
class YourComponent extends React.Component {
render() {
const { myProperty } = this.props;
// 使用myProperty进行其他操作
return (
<div>
{/* 组件内容 */}
</div>
);
}
}
这样,你就可以从React Router 4嵌套路由中的Redux Connect()函数获取属性了。
领取专属 10元无门槛券
手把手带您无忧上云