如何在第一次渲染时获得道具

Question

我有一个容器组件，可以在其中获取ID并将其放入函数中，然后请求就可以了，原则上，道具应该立即出现，但是它们是未定义的。但是，当您重新输入相同的组件时，会显示必要的道具。

说明如何使道具出现在第一个渲染器上？

ForEach(listGames.games.sorted(by: {$0.self.dateOfGame>$1.self.dateOfGame}))

我的要求

class View extends React.Component {
  
  componentDidMount() {
    let id = this.props.match.params.id;
    this.props.GetProjData(id);
  }

  render() {
    return <ProjView {...this.props}></ProjView>;
  }
}

let mapStateToProps = state => {
  return {
    initialValues: {
      NameProj: state.project.OneProject.NameProj,
      Text: state.project.OneProject.Text,
      target: state.project.OneProject.target,
      startdate: state.project.OneProject.startdate,
      enddate: state.project.OneProject.enddate
    },
    error: state.settings.error,
    loading: state.settings.loading
  };
};

Answer 1

如果我正确地理解了您的应用程序流程，则需要考虑请求项目数据到接收项目数据之间的渲染。

class View extends React.Component {
  // constructor fires first so we might as well move it here
  constructor(props) {
    const id = props.match.params.id;
    props.GetProjData(id);
  }

  render() {
    // Your component will rerender before receiving the new data.
    // We block the component from mounting so that initialValues 
    // gets set only when we have the data needed
    if (this.props.initialValues && this.props.initialValues.NameProj) {
      // A better way to do this would be to listen to a loading variable 
      // that gets updated when your request finishes
      return <ProjView {...this.props} />;
    }
    return null; // or loading graphic
  }
}