React-Redux：组件首次挂载时如何获取存储数据答案

【问题标题】：React-Redux: how can i get store data when component first mountsReact-Redux：组件首次挂载时如何获取存储数据
【发布时间】：2018-09-29 07:00:24
【问题描述】：

我已将 api 数据保存在 redux 存储中，并与几个不同的组件一起使用。我正在尝试找出一种在首次安装新组件并且数据已经在存储中时访问此存储数据的方法。

我不能真正作为道具传入，因为组件不是子组件。我考虑过触发 MapStateToProps 事件，但这似乎不是正确的方法。我可以再次调用 api，但这没有意义。

【问题讨论】：

我不明白为什么你不能使用道具。您应该能够使用 React Redux 的 connect 函数将 redux 状态用作道具，而无需父组件对此一无所知。您能否发布代码，以便我们更好地了解您的问题？
也许我误解了你的问题，但这不是 React 生命周期事件的目的吗？具体来说，componentDidMount 中的任何内容都会在您的组件挂载后立即运行。
我为这篇文章道歉。重新检查过程，componentDidMount 确实在道具中包含我的数据。我正在更改代码并重新呈现我的组件页面以查找 api 数据 - 忘记了我必须从流程开始并实际进行原始 api 调用。

标签： reactjs redux

【解决方案1】：

您可以使用“智能组件”来渲染它，而不是渲染组件：

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);

因此，通过这种方式，您的组件将始终连接到您的商店，无论位于何处。

【讨论】：

我使用的是类组件，而不是无状态组件，并且使用了 connect & mapStateToProps。我的问题是 mapStateToProps 仅在存储更改时触发，因此在安装组件时我没有将状态变量设置为存储