使用async和axios创建天气应用

我相当确定这是一个细节，我不记得如何解决，但是我已经获得了从URL提取数据的代码，但是我无法调用setResults（）方法。我敢肯定有办法解决，但是我不确定该怎么做。

 class Test {
        constructor() {
            this.testResults = document.getElementsByClassName('test-results');
        }

        async run() {
            console.log(new Date().toISOString(), '[Test]', 'Running the test');

            // TODO: Make the API call and handle the results
            const url = `.5/weather?q=${query}&appid=25e989bd41e3e24ce13173d8126e0fd6&units=imperial`;
            //Using the axios libary to call the data and log it. 
            const getData = async url => {
                try {
                    const response = await axios.get(url);
                    const data = response.data;
                    console.log(data);
                    var results  = data;
                } catch (error) {
                    console.log(error);
                }
            };
            getData(url);

        }    
        setError(message) {
            // TODO: Format the error
            this.testResults.innerHTML = (message || '').toString();
        }

        setResults(results) {
            results = responses()
            this.testResults.innerHTML = (results || '').toString();
        }

    }

您未看到的错误可能与testResults是HTMLCollection而不是HTMLElement有关。因此，为了使setResults方法正常工作，您需要对其进行调整。在这里，我提供了一种可能的解决方案。

class Test {
    testResults; 
    constructor() {
        this.testResults = document.getElementsByClassName('test-results');
    }

    async run() {
        console.log(new Date().toISOString(), '[Test]', 'Running the test');
        // TODO: Make the API call and handle the results
        const url = `http://api.openweathermap/data/2.5/weather?q=London,uk&appid=25e989bd41e3e24ce13173d8126e0fd6&units=imperial`;
        //Using the axios libary to call the data and log it.
        const getData = async url => {
            try {
                const response = await axios.get(url);
                const data = response.data;
                this.setResults(data);
            } catch (error) {
                console.log(error);
            }
        };
        getData(url);
    }
    setError(message) {
        // TODO: Format the error
        this.testResults[0].innerHTML = (message || '').toString();
    }

    setResults(results) {
        results = JSON.stringify(results);
        for(let resultEl of this.testResults) {
            resultEl.innerHTML = (results || '').toString();
        }
        // this.testResults[0].innerHTML = (results || '').toString();
    }

}

let testObj = new Test();
testObj.run();

使用async和axios创建天气应用

我相当确定这是一个细节，我不记得如何解决，但是我已经获得了从URL提取数据的代码，但是我无法调用setResults（）方法。我敢肯定有办法解决，但是我不确定该怎么做。

 class Test {
        constructor() {
            this.testResults = document.getElementsByClassName('test-results');
        }

        async run() {
            console.log(new Date().toISOString(), '[Test]', 'Running the test');

            // TODO: Make the API call and handle the results
            const url = `.5/weather?q=${query}&appid=25e989bd41e3e24ce13173d8126e0fd6&units=imperial`;
            //Using the axios libary to call the data and log it. 
            const getData = async url => {
                try {
                    const response = await axios.get(url);
                    const data = response.data;
                    console.log(data);
                    var results  = data;
                } catch (error) {
                    console.log(error);
                }
            };
            getData(url);

        }    
        setError(message) {
            // TODO: Format the error
            this.testResults.innerHTML = (message || '').toString();
        }

        setResults(results) {
            results = responses()
            this.testResults.innerHTML = (results || '').toString();
        }

    }

您未看到的错误可能与testResults是HTMLCollection而不是HTMLElement有关。因此，为了使setResults方法正常工作，您需要对其进行调整。在这里，我提供了一种可能的解决方案。

class Test {
    testResults; 
    constructor() {
        this.testResults = document.getElementsByClassName('test-results');
    }

    async run() {
        console.log(new Date().toISOString(), '[Test]', 'Running the test');
        // TODO: Make the API call and handle the results
        const url = `http://api.openweathermap/data/2.5/weather?q=London,uk&appid=25e989bd41e3e24ce13173d8126e0fd6&units=imperial`;
        //Using the axios libary to call the data and log it.
        const getData = async url => {
            try {
                const response = await axios.get(url);
                const data = response.data;
                this.setResults(data);
            } catch (error) {
                console.log(error);
            }
        };
        getData(url);
    }
    setError(message) {
        // TODO: Format the error
        this.testResults[0].innerHTML = (message || '').toString();
    }

    setResults(results) {
        results = JSON.stringify(results);
        for(let resultEl of this.testResults) {
            resultEl.innerHTML = (results || '').toString();
        }
        // this.testResults[0].innerHTML = (results || '').toString();
    }

}

let testObj = new Test();
testObj.run();