javascript - 将 Axios 响应作为 prop 发送到组件

Question

我正在使用 Axios 执行 GET 请求。我能够获取数据并将其记录到控制台。但是，当我将数据发送到我的 react 组件时，该值不会呈现。

这是 GET 请求:

getUserTotalRevenue = (id) => {
    API.getOrderUserTotal(id)
        .then(res => {
            let total = res.data[0].totalAmount.toFixed(2);
            let totalString = total.toString();
            return totalString;
        })
        .catch(error => console.log("User revenue error: " + error))
}

这是组件调用它的地方:

<div>
    {this.state.users.map(user => (
        <div key={user._id}>
            <Grid item lg={12}>
                <Card
                    userImage={this.checkUserImage(user)}
                    fullName={this.fullName(user.firstName, user.lastName)}
                    startDate={this.startDate(user.created_at)}                     
                    totalSales={this.getUserTotalRevenue(user._id)}
                />
            </Grid>
        </div>
    ))}
</div>

Answer 1

编写此代码返回方法。希望对您有帮助。

    <div key={user._id}>
      <Grid item lg={12}>
          <Card
           userImage={this.checkUserImage(user)}
           fullName={this.fullName(user.firstName, user.lastName)}
           startDate={this.startDate(user.created_at)}
           totalSales={this.getUserTotalRevenue(user._id)}

           />
         </Grid>
   </div>