redux-thunk: действия не отправляются - PullRequest
Новая
       21

redux-thunk: действия не отправляются

0 голосов
/ 01 июля 2019

Я пытаюсь создать приложение на реагирующем языке, которое предполагает, что пользователь принимает два входа, а затем делает запрос к API и получает информацию о двух входах. У меня возникли проблемы с избыточностью и избыточностью, особенно с асинхронными действиями.

Это код в моем приложении, с которым у меня возникли проблемы 

export const fetchData = url => {
  console.log("start Fetching");
  return async dispatch => { // this is where the problem is
    dispatch(fetchingRequest());
    try {
      const response = await fetch("https://randomuser.me/api/?results=10");
      const json = await response.text();
      if (response.ok) {
        dispatch(fetchingSuccess(json));
        console.log("JSON", json);
      } else {
        console.log("fetch did not resolve");
      }
    } catch (error) {
      dispatch(fetchingFailure(error));
    }
  };
  console.log("Fetched data");
};

После отладки функции я обнаружил, что при вызове функции fetchData функция будет выполняться, но возвращаемая асинхронная отправка имеет неопределенное поведение.

Выходные данные в отладчике при вызове функции должны быть 

start Fetching
JSON file information/Error

но вывод в отладчике на самом деле 

start Fetching

Это функция, в которой fetchData вызывается в 

_onPress = () => {
    let url = "https://randomuser.me/api/?results=10";
    fetchData(url);
    console.log("should have fetched");
  };

это функция mapDispatchToProps, которую я добавил. Проблема в том, что я не знаю, что добавить в функцию. 

const mapStatetoDispatch = (url, dispatch) => {
  return {dispatch(fetchData(url))}; // do not know what to place in body of function

};

Я связал его в компоненте с 

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(App);

это создатели действий, которые я импортирую, если необходимо 

import {
  fetchingSuccess,
  fetchingRequest,
  fetchingFailure,
  fetchData
} from "../data/redux/actions/appActions.js";

1 Ответ

2 голосов
/ 01 июля 2019

Предполагая, что вы добавили Redux-Thunk в качестве промежуточного программного обеспечения, похоже, ошибки здесь: 

_onPress = () => {
  const { fetchData } = this.props;
    let url = "https://randomuser.me/api/?results=10";
    fetchData(url);
    console.log("should have fetched");
  };

и 

const mapStatetoDispatch = dispatch => ({
  fetchData: url => dispatch(fetchData(url)),
}};
...