• Почему два раза вызывается console.log при получение данных из Saga?

    rockon404
    @rockon404 Куратор тега React
    Frontend Developer
    1. Метод componentDidMound вызывается после монтирования компонента. Естественно данных во время первого рендера быть не может.
    2. Запрос за данными асинхронный, вы не можете знать в какой момент придет ответ. Поэтому хорошим решением будет хранить и использовать ключ состояния загрузки. У вас он присутствует в коде, но не используется(isGettingCityWeather, в моем примере это isFetching)
    3. Ключ состояния загрузки при получении данных и ошибке у вас не обновляется. Исправьте.
    4. city приходит в виде объекта, но в начальном состоянии у вас массив. Исправьте.

    Пример решения:
    const initialState = {
      isFetching: false,
      city: {},
      error: null,
    };
    
    const weatherReducer = (state = initialState, action) => {
      switch (action.type) {
        case 'GET_WEATHER_REQUEST':
          return {
            ...state,
            isFetching: true,
            error: null,
          };
        case 'GET_WEATHER_SUCCEEDED':
          return {
            ...state,
            isFetching: false,
            city: action.payload,
          };
        case 'GET_WEATHER_FAILED':
          return {
            ...state,
            isFetching: false,
            error: action.payload,
          };
        default:
          return state;
      }
    }


    render() {
      const { isFetching, city, error, getWeather } = this.props;
      
      if (isFetching) return <div>Loading...</div>;
    
      if (error) return <TryAgain error={error} handler={getWeather} />;
      
      return <div>{city.now_dt}</div>;
    }
    Ответ написан
    2 комментария