Javascript React异步调用抛出无法将未定义或null转换为Function.getOwnPropertyNames处的对象

我正在尝试调用天气api以异步获取数据。 我正在使用react with redux。 我知道对象的状态最初是未定义的，在API返回成功后，将再次填充该状态。但当我试图检查对象是否未定义或为空时，它总是抛出错误

界定行动：

import axios from 'axios';

export function fetchWeather(location){
   return function(dispatch){
       axios.get('http://api.wunderground.com/api/2f986c7548abb959/conditions/q/'+ location.state + "/" + location.city + ".json")
       .then((response) => {
           dispatch({
               type: "FETCH_WEATHER_FULLFILLED", 
               weather: response.data 
           })
       }).catch( (err) => {
           dispatch({
               type: "FETCH_WEATHER_REJECTED", 
               payload: err 
           })
       })
   } 
}

组件/App.js

import React from 'react';

import Weather from './Weather';
import LocationForm from './LocationForm';

import { fetchWeather } from '../actions/weatherActions';

import {connect} from 'react-redux';

@connect( (store) => {
    return {
        weather: store.weather.weather   
    };          
})

export default class App extends React.Component {   
    componentWillMount(){
        this.props.dispatch( fetchWeather({
            city: 'Boston',
            state: 'MA'
        }));  
    }
    render(){

        const {weather} = this.props;

        return (
           <div> 
               <h1> Weather Check </h1>
                  <Weather weather={weather} />
                 <LocationForm />
            </div>
        )
    }
}

从“React”导入React；
从“./Weather”导入天气；
从“/LocationForm”导入LocationForm；
从“../actions/weatherActions”导入{fetchWeather}；
从'react redux'导入{connect}；
@连接（（存储）=>{
返回{
天气：商店。天气。天气
};          
})
导出默认类App扩展React.Component{
组件willmount（）{
这个。道具。调度（天气）({
城市：“波士顿”，
声明：“妈”
}));  
}
render（）{
const{weather}=this.props；
返回(
天气检查
)
}
}

在Weather.js中（对问题区域进行了评论）

从“React”导入React；
导出默认类Weather.Component{
render（）{
//这里有问题
if（Object.getOwnPropertyNames（this.props.weather）.length==0）{
返回（）
}
返回(
{this.props.weather.current_observation.display_location.full}
)
}
}

我经常收到的是：

我尝试了stackoverflow帖子中提到Object.getOwnPropertyNames返回未定义或null错误的几乎所有选项，但仍然没有成功。任何指点都会有很大的帮助

---

高级干杯

如果在@azium的建议后仍要使用

Object.getOwnPropertyNames

，可以执行以下操作以防止错误并确保始终传递有效的对象：

 @connect( (store) => {
  return {
     weather: store.weather.weather || {}
  };          
})

---

为了完成回答，我没有在屏幕上看到值，因为减速机有一个输入错误

case "FETCH_WEATHER_FULLFILLED": {
            return {
                ...state,
                fetching: false,
                fetched: true,
                weather: action.payload
            }
        }

行动是

.then((response) => {           
           dispatch({
               type: "FETCH_WEATHER_FULLFILLED", 
               weather: response.data 
           })

这是一个输入错误，实际上，我应该输入的是action.weather而不是action.payload

case "FETCH_WEATHER_FULLFILLED": {
            return {
                ...state,
                fetching: false,
                fetched: true,
                weather: action.weather
            }
        }

---

为什么要使用

对象.getOwnPropertyNames

？为什么不<代码>如果（this.props.weather）{..}？azium，事实上，我试过你说的那一个，但它还是不行。正如我在文章中提到的，我尝试了十几种方法来查看是否提取相同的内容，使用if（this.props.fetched），将类组件移动到容器组件，然后使用props作为参数，使用构造函数（）并在内部设置this.props.weather={}initially..Rami enbashi，谢谢！这就是消除错误的诀窍。谢谢你们两位的快速回复，我被困了一段时间。虽然我还没有脱离困境，下一个州仍然没有显示我需要的数据，所以挖掘，至少迈出了一步！！！干杯！非常感谢：）

case "FETCH_WEATHER_FULLFILLED": {
            return {
                ...state,
                fetching: false,
                fetched: true,
                weather: action.weather
            }
        }