使用React并分配变量来获取多个GET请求API

问题描述

我一直在开发一个程序，该程序调用多个API，使结果在应用程序上可见，然后，我还必须跟踪结果，以便将它们进行比较以用于以后的功能。到目前为止，我已经尝试了许多方法，并且效果最好，但是当前代码存在的问题是，在应用程序上只能看到一个响应

import csv

with open('data.csv') as fp:
    reader = csv.DictReader(fp)
    res = {}
    for row in reader:
        res.setdefault(row['Level'],[]).append(int(row['ColumntoSum']))

with open('output.csv','w') as fw:
    writer = csv.writer(fw)
    writer.writerow(('Level','Column'))
    for k,v in res.items():
        writer.writerow((k,sum(v)))

}

解决方法

您的代码中有很多错别字...与我在评论中建议的使用Promise.all的解决方案相比...如果您有任何疑问-问...

export default class GetRequest extends React.Component {
  state = {
    gemBTCask: null,gemBTCbid: null,gemETHask: null,gemETHbid: null
  };

  componentDidMount() {
    Promise.all([
      fetch('https://api.gemini.com/v1/pubticker/ethusd'),fetch('https://api.gemini.com/v1/pubticker/btcusd')
    ])
      .then(([ethResponse,btcResponse]) =>
        Promise.all([ethResponse.json(),btcResponse.json()])
      )
      .then(([ethData,btcData]) =>
        this.setState({
          gemETHask: ethData.ask,gemETHbid: ethData.bid,gemBTCask: btcData.ask,gemBTCbid: btcData.bid
        })
      )
      .catch(error => {
        console.error({ error });
      });
  }

  render() {
    const { gemBTCask,gemBTCbid,gemETHask,gemETHbid } = this.state;

    return (
      <div className="card text-center m-3">
        <div className="card-body">gemini BTC bid: $: {gemBTCbid}</div>
        <div className="card-arm">gemini BTC ask: $: {gemBTCask}</div>
        <div className="card-ear">gemini ETC bid: $: {gemETHbid}</div>
        <div className="card-leg">gemini ETC ask: $: {gemETHask}</div>
      </div>
    );
  }
}

实时演示：https://stackblitz.com/edit/react-gwkh8s?file=src%2FApp.js