リダクターは特定の行動を1つも見ません[反応 - 還元]

Question

あなたは私の最後の希望です。私は今、とてもイライラしています...

私はすべてのプロジェクトファイルを Githubに入れました。

これは私の問題です。 fetchWeatherは、（ユーザー入力の都市、私のアプリはfetchLocationでアクションを派遣して、Googleマップからデータを取得している

） & ）

fetchLocation（：アクションの中に、私は2つの機能を持っているindex.jsファイルのフォルダApi。 PromiseはReduxPromise Middlewareによってオブジェクトに変更され、すべて正常に動作します。このデータを使用して、Googleマップを使用してその都市をウェブサイトに表示することができます。

今私は緯度が&です。fetchWeather（lat、lng）でそのデータを使用しています。 inside actions/index.js私のfetchWeather（） console.logにデータがあるので、機能が動作しています。新しい緯度が& lngの場合、天気予報を使ってapi.wundergroundから新しいデータを取得します。そして、私はconsole.logの中でこのデータを見ることができ、request2は約束です。

これは、このバグ/奇妙な動作です。 fetchWeatherは、fetchLocationのように動作しません。私は

return { 
    type: FETCH_WEATHER, 
    payload: request2 
    }; 

reducer_weather.jsを返すことはありませんスイッチケースFETCH_WEATHER、 でトリガされることはありませんし、私は（ 'INSIDEを！'）CONSOLE.LOG見たことがありません。

私はReduxDevTootlsを使用しています。私のアプリケーションで実行されるものはすべて、場所の減速機によって状態が更新されるため、複数のマップを持つことができますが、reducer_weatherは常にサイレントです。

どうか教えてください。

ここはactions/index.jsのコードです。その他のコードは、 Githubで見つけることができます。

import axios from 'axios'; 
export const FETCH_LOCATION = 'FETCH_LOCATION'; 
export const FETCH_WEATHER = 'FETCH_WEATHER'; 
const API_KEY_GOOGLE = 'AIzaSyDNMmI2f7qIcBnKgV1dYXmi995BY_8zoJM'; 
const API_KEY_WUNDERGROUND = 'cd8c7ea98a37877f'; 

export function fetchLocation(city) { 
    const url = `https://maps.googleapis.com/maps/api/geocode/json?address=${city}&key=${API_KEY_GOOGLE}` 
    const request = axios.get(url); 
    console.log('request1: ', request); 
    return { 
    type: FETCH_LOCATION, 
    payload: request 
    }; 
} 

export function fetchWeather(lat, lng) { 
    console.log(lat, lng); 

    const url = `https://api.wunderground.com/api/${API_KEY_WUNDERGROUND}/forecast10day/q/${lat},${lng}.json`; 

    console.log(url); 

    const request2 = axios.get(url); 

    console.log('request2: ', request2); 

    return { 
    type: FETCH_WEATHER, 
    payload: request2 
    }; 
} 

Answer 1

あなたは行動をdispatch必要があります。しかし、単にアクションジェネレータを通常の関数として呼び出すだけです。

あなたactionCreatorsがRedux Connectを通じてdispatchにバインドされているので、あなたのレポから

this.props.fetchWeather(lat, lng); 

と

fetchWeather(lat, lng); 

をthisラインを交換してください。

UPDATE：thisComponentクラスの（ライフ・サイクル・メソッドをデフォルトではない）ユーザー定義関数では使用できません。したがって、es6という太い矢印の機能を使用して、独自の機能の中のthisにアクセスしてください。