Javascript ReactJS-值从带有参数的函数返回,但未定义

Javascript ReactJS-值从带有参数的函数返回,但未定义,javascript,reactjs,ecmascript-6,Javascript,Reactjs,Ecmascript 6,我有一个react应用程序,试图将开尔文温度转换为华氏温度。我有一个简单的设置,但是我从一个函数中得到了未定义的值 //this is the cityweathercomponent import React, { Component } from "react"; class CityWeather extends Component { // (280.89K − 273.15) × 9/5 + 32 getFahrenheit = (now, minimum, ma

我有一个react应用程序,试图将开尔文温度转换为华氏温度。我有一个简单的设置,但是我从一个函数中得到了未定义的值

//this is the cityweathercomponent
import React, { Component } from "react";

class CityWeather extends Component {

    // (280.89K − 273.15) × 9/5 + 32

    getFahrenheit = (now, minimum, maximum) => {

        let arr = [now , minimum , maximum];
        let result = [];

        for (let value of arr) {
            let num = (value - 273.15) * 9/5 + 32;
            result.push(num);
        }
        let current = result[0];
        let min = result[1];
        let max = result[2];

        console.log(result);

        return {current, min, max};
    };

    render(){

        let cityID = this.props.city;
        let weatherData = this.props.weatherData;

        let currentWeather = weatherData.list[0];
        let condition = currentWeather.weather[0].main;


        let {temp, minTemp, maxTemp} = this.getFahrenheit(currentWeather.main.temp, currentWeather.main.temp_min, currentWeather.main.temp_max);

        console.log(temp, minTemp, maxTemp);

        return(
            <div>
                <h2>condition</h2>
                <p>{condition}</p>

                <br/>
                <h2>current temp</h2>
                <p>{temp}</p>

                <br/>
                <h2>max temp</h2>
                <p>{maxTemp}</p>
                <br/>
                <h2>min temp</h2>
                <p>{minTemp}</p>
            </div>


        );
    }

}

export default CityWeather;
//这是城市天气组件
从“React”导入React,{Component};
类CityWeather扩展组件{
//(280.89K)− 273.15) × 9/5 + 32
getFahrenheit=(现在,最小值,最大值)=>{
设arr=[现在,最小值,最大值];
让结果=[];
for(arr的let值){
设num=(值-273.15)*9/5+32;
结果:推送(num);
}
让电流=结果[0];
设min=结果[1];
设max=result[2];
控制台日志(结果);
返回{current,min,max};
};
render(){
让cityID=this.props.city;
设weatherData=this.props.weatherData;
设currentWeather=weatherData.list[0];
让条件=currentWeather.weather[0].main;
设{temp,minTemp,maxTemp}=this.getFahrenheit(currentWeather.main.temp,currentWeather.main.temp_min,currentWeather.main.temp_max);
控制台日志(temp、minTemp、maxTemp);
返回(
条件
{条件}


当前温度 {temp}


最高温度 {maxTemp}


最低温度 {minTemp}

); } } 导出默认城市天气;
所以我是
这个.getFahrenheit
函数中的temp,结果应该是一个具有多个值的对象

这些参数在该函数中运行,并在华氏温度下转换。它们存储在一个数组中,每个数组都设置为变量。最后,它们将作为对象
{current,min,max}
返回

但是在控制台中,我得到了未定义的结果,并且不确定发生了什么。我看到了其他与我类似的例子,结果也不错——我确信我在这里遗漏了一些东西


我不熟悉ReactJS,特别是ES6,所以我想了解这里发生了什么,以及为什么它们被设置为未定义。最终目标是在渲染中显示新值,以正确的格式显示临时值。感谢您的帮助。

问题在于您的
渲染方法中的以下行:

let {temp, minTemp, maxTemp} = this.getFahrenheit(currentWeather.main.temp, currentWeather.main.temp_min, currentWeather.main.temp_max);
方法
this.getFahrenheit
返回一个对象,其中包含键
current
min
max
,但表示法
let{temp,minTemp,maxTemp}=this.getFahrenheit(…)
查找键
temp
minTemp
,和
this.getFahrenheit
的输出中的
maxTemp
。由于这些键不在输出中,变量
temp
minTemp
maxTemp
的值都变为
未定义的

您可以使用与
this.getFahrenheit
(变量:
current
min
max
)的输出键中定义的相同变量名称,如下所示:

let {current, min, max} = this.getFahrenheit(currentWeather.main.temp, currentWeather.main.temp_min, currentWeather.main.temp_max);
或者,您可以将变量重命名为当前正在使用的变量(变量:
temp
minTemp
maxTemp
):


更多信息请参见文档:

返回{current,min,max}
返回此对象:
{current:current,min:min,max:max}
。您正在尝试获取
{temp,minTemp,maxTemp}
但是这些字段都不存在。哦,我明白了,在返回
返回{current,min,max}中的命名约定需要相同
和输出
让{current,min,max}
。我想知道为什么其他答案中的其他函数即使具有相同的设置也能工作。
let {current: temp, min: minTemp, max: maxTemp} = this.getFahrenheit(currentWeather.main.temp, currentWeather.main.temp_min, currentWeather.main.temp_max);