React - 使用相同的道具传播 MapStateToProps

Question

我有这个 MapStateToProps:

const mapStateToProps = (state) => {
  const date = new Date();
  const year = date.getFullYear();
  const month = date.getMonth() + 1;

  const ESFReport = getESFReport(state);
  const resultStatusReport = getResultStatusReport(state);

  return {
    companInfo: getCompanyInfo(state),
    companyId: getCompanyId(state),
    ...ESFReport,
    ...resultStatusReport,
    year,
    month,
  };
};

...ESFReport, 和 ...resultStatusReport 都具有相同的属性: report 但我需要以某种方式更改名称，因为在同一个组件中我使用 const { report } = this.props 两次，但使用不同的道具。

我该怎么做？（它曾经在我只有 ...ESFReport 时工作，但当我添加 ...resultStatusReport 时，它就坏了）。

提前致谢。

Answer 1

如果您不需要 ESFReport 和 resultStatusReport 对象中的 report 以外的任何东西，您可以这样做：

const mapStateToProps = (state) => {
  const date = new Date();
  const year = date.getFullYear();
  const month = date.getMonth() + 1;

  const { report: ESFReport } = getESFReport(state);
  const { report: resultStatusReport } = getResultStatusReport(state);

  return {
    companInfo: getCompanyInfo(state),
    companyId: getCompanyId(state),
    ESFReport,
    resultStatusReport,
    year,
    month,
  };
};

它只是将每个 report 属性重命名为 ESFReport 和 resultStatusReport。然后你会得到 this.props.ESFReport 实际上是 ESFReport.report 和 this.props.resultStatusReport 这将是 resultStatusReport.report.

React - 使用相同的道具传播 MapStateToProps

React - Spread MapStateToProps with the same props

javascript

reactjs

spread-syntax