2017-10-04 33 views
1

我向兩個不同的API請求接受[比特幣/美元]和[英鎊/美元]。我正在使用axios來設置promise,並且在兩個調用都成功解析時,我將這兩個值都設置爲set.State{}兩種不同的API調用 - 計算匯率

我試圖計算英鎊/比特幣之間的匯率,但對於我的生活無法包裹我的頭如何最好地做到這一點。自從我使用React以來,也有一段時間了,所以任何關於改進我所得到的建議都會很棒。

app.js

import React, { Component } from 'react'; 
import './App.css'; 
import axios from 'axios'; 

class App extends Component { 

    constructor(props) { 
    super(props); 

    this.state = { 
     conv: [], 
     GBP: [], 
     XBT: [], 
    }; 
    } 

    componentDidMount() { 
    axios.all([this.getXbt(), this.getGbp()]) 
     .then(axios.spread((xbtValue, gbpValue) => { 
     const XBT = xbtValue.data.bpi.USD.rate_float; 
     const GBP = gbpValue.data.rates.GBP; 
     const conv = this.calcConversion(GBP, XBT); 
     this.setState({conv, GBP, XBT}); 
     })); 
    } 

    calcConversion(x, y) { 
    // Calculate conversion value here 
    return x/y; 
    } 

    getXbt() { 
    return axios.get('https://api.coindesk.com/v1/bpi/currentprice/XBT.json'); 
    } 

    getGbp() { 
    return axios.get('https://openexchangerates.org/api/latest.json?app_id=#API_KEY#'); 
    } 

    render() { 
    return (
     <div className="App"> 
      <div id="crypto-conversion"> 
      <span className="left">{this.state.conv}</span> 
      </div> 
      <div id="crypto-container"> 
      <span className="left">{this.state.GBP}</span> 
      <span className="right">{this.state.XBT}</span> 
      </div> 
     </div> 
    ); 
    } 
} 

export default App; 

回答

2

假設的API作爲GBP/1USDUSD/1XBT返回數據,則轉換率是簡單地在兩個值的乘積,並且將導致GBP/1XBT

它也一直是同時一點點,因爲我用反應,所以對提高我有什麼任何意見將是巨大的。

您的代碼目前看起來很好。我喜歡你處理API調用的方式,並且只要調用一次就遵循約定。

編輯:

而且,我只是,如果你願意掏出$ 95 /月實現的,開放匯率API提供了一個/convert端點支持BTC