Ошибка типа: не удается прочитать свойство 'температура', равное нулю

Question

Я новичок в React - я получаю это TypeError: Cannot read property 'temperature' of null, где оно не позволяет мне привязать переменную температуры к компоненту в return().Я могу увидеть данные в консоли, прежде чем связывать их.Код: `class Приложение расширяет React.Component {состояние: {температура: не определено, город: не определено, страна: не определено, влажность: не определено, описание: не определено, ошибка: не определено} getWeather = async (e) => {e.preventDefault ();

const city = e.target.elements.city.value;
const country = e.target.elements.country.value;
const api_call = await 
fetch(`http://api.openweathermap.org/data/2.5/weather? 
q=${city},${country}&appid=${API_KEY}&units=metric`);
const data = await api_call.json();
console.log(data);
 this.setState({
   temperature: data.main.temp,
    city: data.name,
    country: data.sys.country,
    humidity: data.main.humidity,
    description: data.weather[0].description,
    error: ""
 });
}


render(){
return (
  <div>
    <h2>Check Weather Component</h2>
    <Titles />
    <Form getWeather={this.getWeather}/>
    <Weather
      temperature={this.state.temperature} 
      humidity={this.state.humidity}
      city={this.state.city}
      country={this.state.country}
      description={this.state.description}
      error={this.state.error}
              />

  </div>
 );
}

};

приложение экспорта по умолчанию; `

Answer 1

Ваш компонент не имеет состояния по умолчанию, поэтому this.state будет null, и попытка получить доступ к свойству temperature приведет к вашей ошибке.

Напишите state = { ... } вместо state: { ... }, и вашему компоненту будет присвоено состояние по умолчанию, и он будет работать как положено.

class App extends React.Component {
  state = {
    temperature: undefined,
    city: undefined,
    country: undefined,
    humidity: undefined,
    description: undefined,
    error: undefined
  };

  // ...
}