你是我最后的希望。我现在很沮丧
我已经将所有项目文件放到
Github。
这是我的问题。在index.js文件中的actions文件夹中,我有两个功能:
fetchLocation()和fetchWeather()
当用户输入城市时,我的应用程序正在使用fetchLocation调度操作,并且正在从Google Maps Api获取数据。 ReduxPromise中间件将Promise更改为对象,并且一切正常。我可以使用这些数据通过Google地图在网站上显示该城市。
现在我有了lat&lng,因此我将该数据与fetchWeather(lat,lng)一起使用。
在actions / index.js内部,我的fetchWeather()函数正在运行,因为我在console.log中看到了数据。使用新的纬度和纬度,它可以从api.wunderground获取具有天气预报的新数据。而且我可以在console.log和request2里面看到这些数据。
这是此错误/奇怪的行为。 fetchWeather永远不会像fetchLocation那样表现。我再也没有回来
return {
type: FETCH_WEATHER,
payload: request2
};
切换案例FETCH_WEATHER永远不会触发reducer_weather.js,
而且我从未见过console.log('INSIDE!')。
我正在使用ReduxDevTootls,我的应用程序所做的所有事情都是通过位置缩减器更新状态,因此我可以拥有多个地图,但是reducer_weather始终保持沉默。
你能告诉我为什么吗?
这是我来自action / 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
};
}
最佳答案
您必须dispatch
操作。但是,您只是将动作生成器称为普通函数。
替换仓库中的this行
fetchWeather(lat, lng);
与
this.props.fetchWeather(lat, lng);
由于您的actionCreator已通过Redux Connect与
dispatch
绑定。更新:
this
不适用于Component
类的用户定义函数(不是默认的生命周期方法)。因此,请使用es6
的粗箭头功能访问您自己的函数内的this
。关于javascript - reducer 看不到一个特定的 Action [react-redux],我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44070490/