【问题标题】:Redux Saga - yield call not returning dataRedux Saga - 产生调用不返回数据
【发布时间】:2018-01-11 15:58:20
【问题描述】:

您好,我是 Redux 新手

问题

我成功调用了我的 API,但我发现由于某种原因它没有返回任何数据。当我在控制台上看到 XHR 选项卡时,我看到一个 HTTP 200 并且有一个有效负载,但我没有看到任何错误,这让我不确定为什么我没有看到任何数据被返回。我看到我的 saga 文件正在调用我的操作 CREATE_MATRIX_REQUEST,然后它立即调用 CREATE_MATRIX_SUCCESS。我真的不知道为什么会这样,任何帮助将不胜感激

actions.js

import {
  CREATE_MATRIX_REQUEST,
  CREATE_MATRIX_SUCCESS,
  CREATE_MATRIX_ERROR
} from './constants';



/**
 * Tells the app we want to create a matrix request
 */
export function createMatrixRequest(data) {
  return { type: CREATE_MATRIX_REQUEST, data};
}

/**
 * Tells the app the matrix request was succesfully made
 */
export function createMatrixSuccess(data) {
  return { type: CREATE_MATRIX_SUCCESS, data };
}

/**
 * Tells the app the matrix request failed
 */
export function createMatrixError(error) {
  return { type: CREATE_MATRIX_ERROR , error };
}

reducer.js

/*
 * The reducer takes care of state changes in our app through actions
 */
import { fromJS } from 'immutable';
import {
    CREATE_MATRIX_REQUEST,
    CREATE_MATRIX_SUCCESS,
    CREATE_MATRIX_ERROR
} from './constants';

// The initial application state
 const initialState = fromJS({
   success: false,
   error:''
 });

// Takes care of changing the application state
function createMatrixReducer(state = initialState, action) {
  switch (action.type) {
    case CREATE_MATRIX_REQUEST:
     return state;
    case CREATE_MATRIX_SUCCESS:
    console.log(action, 'This is a paylaod')
     return state.set('success', true);
    case CREATE_MATRIX_ERROR:
      return state.set('error', action.payload);
    default:
      return state;
  }
}


export default createMatrixReducer;

sagas.js

import { call, put } from 'redux-saga/effects';
import { takeEvery } from 'redux-saga/effects'
import { createMatrix } from './utils';
import { browserHistory } from 'react-router';

import { CREATE_MATRIX_REQUEST, CREATE_MATRIX_SUCCESS, CREATE_MATRIX_ERROR } from './constants';

export function* createMatrixSaga(action) {
   try {
      //Calls the API and sends payload
      const data = yield call(createMatrix, action.data);
      // We send an action that tells Redux we're sending a payload
      yield put({type: CREATE_MATRIX_SUCCESS, success: data});
      //Forward to /reports once actions is sent
      yield call(forwardTo, '/reports');

   } catch(error) {
     // We send an action that tells Redux we're sending an error
     yield put({type: CREATE_MATRIX_ERROR, error: error });
   }
}


function* watchFetchData() {
  // We send an action that tells Redux we're sending a request
    yield takeEvery(CREATE_MATRIX_REQUEST, createMatrixSaga);
}


export default [
  watchFetchData,
];

// Little helper function to abstract going to different pages
export function* forwardTo(location) {
  yield call(browserHistory.push, location);
}

utils.js

import axios from 'axios';
import cookie from 'react-cookie';


export function createMatrix({domain, kw}) {

  var token = cookie.load('token');
  var url = '';
  var keywords = kw;
  var encoded = encodeURI(keywords);
  var data = {
     key: token,
     keywords: encoded,
     analysisname: domain,
     country:1,
     location:null,
     trafficstats:false,
     use_majestic_api:false
  }
  axios.post(url, data).then((response) => {
      return response
  })
  .catch((error) => {
    throw error
  });
}


export default createMatrix;

【问题讨论】:

    标签: redux react-redux redux-saga


    【解决方案1】:

    如果有payload,我认为问题出在axios post result,例如:

    import axios from 'axios';
    import cookie from 'react-cookie';
    
    
    export function createMatrix({domain, kw}) {
    
      var token = cookie.load('token');
      var url = '';
      var keywords = kw;
      var encoded = encodeURI(keywords);
      var data = {
         key: token,
         keywords: encoded,
         analysisname: domain,
         country:1,
         location:null,
         trafficstats:false,
         use_majestic_api:false
      }
      return axios.post(url, data).then((response) => {
          return response.data
      })
      .catch((error) => {
        throw error
      });
    }
    
    
    export default createMatrix;
    

    【讨论】:

      猜你喜欢
      • 2020-02-22
      • 2022-01-15
      • 1970-01-01
      • 2021-12-28
      • 1970-01-01
      • 2021-07-26
      • 2021-09-20
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多