如何从API中获取响应数据，并使用NodeJSJavaScript从数据中编写函数以获得结果

我认为我在编码方面做得很糟糕，因为我还是node.js、javascript和vue的新手。我做了一个货币转换器，通过从API获取数据来获得汇率，并在函数中进行了一些计算。在“检查”中，控制台确实从所选国家/地区获取了汇率，但没有结果，我的计算是否错误？还是函数中的代码如此混乱？我需要帮助。下面是我的代码：

<h1 id="main-heading">Currency Conversion</h1>
<div id="input-container">
    <span class="input-text">Convert</span>
    <select id="from-currency" v-model="fromCurrency">
        <option value="">Select currency</option>
        <option value="USD">US Dollar (USD)</option>
        <option value="MYR">Malaysia (MYR)</option>
    </select>
    <input type="number" id="from-amount" placeholder="Amount" v-model="fromAmount" />
    <span class="input-text">To</span>
    <select id="to-currency" v-model="toCurrency">
        <option value="">Select currency</option>
        <option value="USD">US Dollar (USD)</option>
        <option value="MYR">Malaysia (MYR)</option>
    </select>
    <button type="button" id="convert-btn" @click="clickConvert()">
        Convert
    </button>

功能

methods: {
    clickConvert() {
        if (!(this.fromCurrency == '' || this.toCurrency == '' || (this.fromAmount <= 0) || this.fromCurrency == this.toCurrency)) {
            this.convertClicked = true
        }
        this.convert()
    },

方法：{
单击转换（）{
如果（！（this.fromCurrency=''this.toCurrency==''this.fromAmount{
警报（“获取结果时出现问题。请重试。”+错误）
})
}
}

结果是这样的…（那里不能兑换货币，但可以得到汇率）

---

该错误称为ReferenceError:response未定义。

您的承诺链的第二部分将在您尝试在此处使用时丢失此的上下文

                .then(function (data) {
                    console.log(data.rates)
                    for (let [key, value] of Object.entries(data.rates))
                        var jsResult = data.rates;
                    var toCurrency = response.json(this.toCurrency);
                    var fromCurrency = response.json(this.fromCurrency);
                    var fromAmount = response.json(this.fromAmount);
                    var result = this.result;
                    var oneUnit = jsResult.toCurrency / jsResult.fromCurrency;
                    result = (oneUnit * fromAmount).toFixed(2);
                    this.loading = false
                })

您可以在

convert（）

函数的作用域中将

this

重新定义得更高，并使用新变量，或者将此处的函数调整为箭头函数，这将保持

this

的上下文。后一个选项当然更简单、更好

.then((data) => {
    ...

---

您可以在此处查看有关箭头函数和上下文的更多信息：

请在说明中包含错误消息，而不仅仅是图像。错误表示ReferenceError:response未定义。

convert() {
        if (this.fromCurrency == '' || this.toCurrency == '' || (this.fromAmount <= 0) || this.fromCurrency == this.toCurrency) {
            alert("Please check your inputs and try again")
        } else {
            this.loading = true
            let uri = 'https://api.exchangeratesapi.io/latest?symbols=' + this.fromCurrency + "," + this.toCurrency;
            fetch(uri, {
                    "method": "GET",
                })
                .then((response => response.json()))
                .then(function (data) {
                    console.log(data.rates)
                    for (let [key, value] of Object.entries(data.rates))
                        var jsResult = data.rates;
                    var toCurrency = response.json(this.toCurrency);
                    var fromCurrency = response.json(this.fromCurrency);
                    var fromAmount = response.json(this.fromAmount);
                    var result = this.result;
                    var oneUnit = jsResult.toCurrency / jsResult.fromCurrency;
                    result = (oneUnit * fromAmount).toFixed(2);
                    this.loading = false
                })
                .catch(err => {
                    alert("There was a problem fetching the results. Please try again." + err)
                })
        }
    }

                .then(function (data) {
                    console.log(data.rates)
                    for (let [key, value] of Object.entries(data.rates))
                        var jsResult = data.rates;
                    var toCurrency = response.json(this.toCurrency);
                    var fromCurrency = response.json(this.fromCurrency);
                    var fromAmount = response.json(this.fromAmount);
                    var result = this.result;
                    var oneUnit = jsResult.toCurrency / jsResult.fromCurrency;
                    result = (oneUnit * fromAmount).toFixed(2);
                    this.loading = false
                })

.then((data) => {
    ...