Question

我正在尝试从交换器API加载数据，但是有些方法无法加载交换器的数据！

componentDidMount() {
        this.setState({loading: true})
        fetch("https://api.exchangeratesapi.io/latest")
            .then(response => response.json())
            .then(data => {
                console.log(data)
                this.setState({
                    loading: false,
                    currency: data,
            })
            })
    }

  render() {
        var text = this.state.loading ? "loading..." : this.state.currency.BGN
        return (
            <div>
                <p>{this.state.currency.RON}</p>
            </div>
        )
    }

我尝试了最愚蠢的方式来加载数据。

omponentDidMount() {
        this.setState({loading: true})
        fetch("https://api.exchangeratesapi.io/latest")
            .then(response => response.json())
            .then(data => {
                console.log(data)
                this.setState({
                    loading: false,
                    currency: data,
                    bulgaria:data.rates.BGN,
      })
            })
    }

在render内

var text = this.state.loading ? "loading..." : this.state.currency.bulgaria

但是我相信有一种更好的方法可以做到这一点。

Answer 1

您正尝试直接从currency访问该属性，但是它存在于rates中。

这是不正确的：

{this.state.currency.RON}

应该是：

{this.state.currency.rates.RON}

类似地，您创建的变量文本不会在任何地方使用。恕我直言，应该是这样的：

    render() {
            const {loading, currency} = this.state;
            console.log(currency); //only for debugging
            return (
                { loading? 'Loading...' : (
                <div>
                    <p>{currency.rates.RON}</p>
                </div>)
                }
            )
        }

无法获得任何汇率的价值

1 个答案: