哪种React生命周期方法最适合对道具更改进行API调用

Question

我们正在使用React 16.8版本。我想知道执行API调用的最适合生命周期的方法是什么。

我正在使用的应用程序是一个典型的应用程序。它在左窗格中有一个项目列表，单击该项目时，编辑视图将显示在右窗格中。左侧的所选项目将作为道具传递给右侧窗格组件。

仅查看React文档，我就不建议再使用ComponentWillRecieveProps，而我们需要使用getDerivedStateFromProps，我们应该简单地返回需要在状态下更新的新对象。但是，在我的用例中，我需要在每次道具更改时都制作一个API，并获得关于该道具的一些其他详细信息。

请问，哪种生命周期方法合适？

I tried updating the state in the right pane component with the props passed from the left pane.

async componentDidUpdate(prevProps) {
    if (prevProps.person!== this.state.initialValue) {
        this.setState({
            initialValue: this.props.person,
            editedPerson: Object.assign({}, this.props.person)
        });

        let abc= await this.props.getAbc(this.props.person.dS_KEY);
        this.setState({
            abc
        });
        // Since these are asynchronous and takes random time to finish, I would like them to render when they receive the response from API.
        let def= await this.props.getDef(this.props.person.dS_KEY);
        this.setState({
            def
        });
    }
}