首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

无法从React Router 4嵌套路由中的Redux Connect()获取属性

React Router 4是一个用于构建单页应用的React路由库,它提供了一种将组件与URL进行映射的方式。Redux Connect()是一个用于连接React组件与Redux状态管理库的函数。

在React Router 4的嵌套路由中,如果想要从Redux Connect()获取属性,需要确保Connect()函数包装的组件位于路由组件的内部。这样可以确保Connect()函数能够访问到Redux store中的状态,并将其作为属性传递给包装的组件。

以下是一种可能的解决方案:

  1. 确保你的Redux Connect()函数包装的组件位于路由组件的内部。例如,你可以在路由组件的render()方法中渲染Connect()函数包装的组件。
代码语言:txt
复制
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>
    );
  }
}
  1. 确保你在Connect()函数的mapStateToProps函数中正确地映射Redux store中的状态到组件的属性上。这样,你就可以在组件中通过props访问到这些属性。
代码语言:txt
复制
const mapStateToProps = (state) => {
  return {
    myProperty: state.myProperty
  };
};
  1. 确保你在组件中正确地访问Connect()函数传递的属性。你可以通过props来访问这些属性。
代码语言:txt
复制
class YourComponent extends React.Component {
  render() {
    const { myProperty } = this.props;
    // 使用myProperty进行其他操作
    return (
      <div>
        {/* 组件内容 */}
      </div>
    );
  }
}

这样,你就可以从React Router 4嵌套路由中的Redux Connect()函数获取属性了。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券