React-Redux:如何在组件首次安装时获取商店数据

时间:2018-04-18 22:15:08

标签: reactjs redux

我在redux商店中保存了api数据,我使用了几个不同的组件。我试图找到一种方法来在首次安装新组件并且数据已经存储时访问此存储数据。

我无法真正传入道具,因为组件不是孩子。我考虑过触发MapStateToProps事件,但这看起来并不正确。我可以再次打电话给api,但这没有用。

1 个答案:

答案 0 :(得分:2)

您可以使用“智能组件”并渲染它,而不是渲染组件:

import React, { PureComponent } from 'react';
import RPT from 'prop-types';
import { connect } from 'react-redux';

const mapStateToProps = state => ({
  name: state.user.name
});

class WelcomeMessage extends PureComponent {
  static propTypes = {
    name: RPT.string.isRequired;
  }

  render() {
    const { name } = this.props;
    return (
      <h2>
        {`Welcome, ${name}`}
      </h2>
    );
  }
}

export default connect(mapStateToProps)(WelcomeMessage);

因此,无论身在何处,您的组件都将始终连接到您的商店。

推荐讲座: Difference between smart and dumb components in React