Reactjs 如何使用react js将多个对象发送到API并从API获取结果?

Reactjs 如何使用react js将多个对象发送到API并从API获取结果?,reactjs,rest,Reactjs,Rest,我正在开发一个小模块,乘客可以选择路线,他们可以看到观看同一路线的人数。我想通过点击API来获取这些细节。要获取计数详细信息,我需要将多个参数发送到API。参数包括:开始日期、结束日期和路线详细信息。我是react js的新手,我搜索了如何使用“Axios”和“async”将多个参数传递给API,并从API获取详细信息。下面是使用“async”的代码没有得到预期的输出。我看不清楚。有没有其他方法来实现这一点。有谁能解释一下如何传递多个值并点击API端点来获取计数细节。提前谢谢 async com

我正在开发一个小模块,乘客可以选择路线,他们可以看到观看同一路线的人数。我想通过点击API来获取这些细节。要获取计数详细信息,我需要将多个参数发送到API。参数包括:开始日期、结束日期和路线详细信息。我是react js的新手,我搜索了如何使用“Axios”和“async”将多个参数传递给API,并从API获取详细信息。下面是使用“async”的代码没有得到预期的输出。我看不清楚。有没有其他方法来实现这一点。有谁能解释一下如何传递多个值并点击API端点来获取计数细节。提前谢谢

async componentDidMount() {
            let userData = await API.get('/', {
              params: {
                results: 1,
                param: 'sDate =  moment().subtract('1.5', 'hours'),
                        EDate =  moment().subtract('0.5', 'hours'),
                        Routes

              }
            });

            userData = userData.data.results[0];

            const sdate = userData.name.sDate ;
            const edate = userData.picture.EDate ;
            const routes= userData.Routes;

            this.setState({
              ...this.state, ...{
                isLoading: false,
                sdate ,
                edate ,
                routes
              }
            });
          }

        export default App;

我不知道您的API实现,但您可能希望将param更改为如下所示的对象,并定义Routes对象(如果您还没有这样做)

let userData = await API.get('/', {
    params: {
        results: 1,
        param: {
            sDate: moment().subtract('1.5', 'hours'),
            EDate: moment().subtract('0.5', 'hours'),
            Routes
        }
    }
});

如果我们将
async
关键字放在componentDidMount方法的开头,则方法返回类型将更改为Promise。它可能会影响
组件didmount
生命周期方法的内部行为

所以你可以像传统的那样使用它,捕捉下面的方块

componentDidMount() {
    API.get('/', {
        params: {
            results: 1,
            param: 'sDate =  moment().subtract('
            1.5 ', '
            hours '),
            EDate = moment().subtract('0.5', 'hours'),
            Routes

        }
    }).then((userData) => {
            userData = userData.data.results[0];

            const sdate = userData.name.sDate;
            const edate = userData.picture.EDate;
            const routes = userData.Routes;

            this.setState({
                ...this.state,
                ...{
                    isLoading: false,
                    sdate,
                    edate,
                    routes
                }
            });
        }
    }).catch((error) => console.error(error));
}

参数条目看起来不正确。