时间戳

首页 > 解决方案 > 无法读取未定义的属性“天空”

javascript - 无法读取未定义的属性“天空”

问题描述

我想显示一个图标并使用 API 给我的参数。每当我尝试这样做时，我都会变得不确定。尝试这样做：


import React from 'react';
import './WeatherBox.css'
import { Icons } from '../../icons';


const dateBuilder = (d) => {
    let months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
    let days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

    let day = days[d.getDay()];
    let date = d.getDate();
    let month = months[d.getMonth()];
    let year = d.getFullYear();

    return `${day} ${date} ${month} ${year}`
}

const WeatherBox = ({result}) => {

        return (
            <div className="locationDate">
                <span>{result.location}</span>
                <span>{dateBuilder(new Date())}</span>
                <span>{result.temp}°C</span> 
                {/* <span>{Icons.Clouds}</span> */}
                <span>{result ? Icons.result.sky : null}</span>
            </div>
        )

}

export default WeatherBox;

result.sky是 API 给我返回的变量，例如“Clouds”“Sunny”等。这就是我的图标的命名方式，我想在加载 API 时显示它们。我使用的条件不起作用，它甚至想在返回 API 之前显示。

标签： javascriptreactjs

解决方案

答案是我试图引用 Icons 错误。我不得不像 Icons[result.sky] 那样使用 Icons.result.sky，而不是使用它。

推荐阅读