React Native中的Redux-Saga错误

时间:2017-12-12 06:09:24

标签: javascript android react-native redux saga

我使用React Native创建了一个应用程序,并希望使用redux-saga从API获取数据。 在配置我的redux和sagas之前,一切正常。
这是我添加和修改的:

ReactRestoRedux.js

import { createReducer, createActions } from 'reduxsauce'
import Immutable from 'seamless-immutable'

// Categories types
const { Types, Creators } = createActions({
    categories: null,
    categoriesSucceed: ['payload'],
    categoriesFailed: null
})

export const ReactRestoTypes = Types
export default Creators

// Initial state
export const INITIAL_STATE = Immutable({
    payload: null,
    errorMessage: null,
    fetchCategories: false
})

// Reducers
export const categoriesRequest = (state) => 
    state.merge({ fetchCategories: true })

export const categoriesRequestSucceed = (state, action) => {
    const { payload } = action
    return state.merge({ fetchCategories: false, errorMessage: null, payload})
}

export const categoriesRequestFailed = (state) =>
    state.merge({ fetchCategories: false, errorMessage: true})

export const reducer = createReducer(INITIAL_STATE, {
    [Types.CATEGORIES_REQUEST]: categoriesRequest,
    [Types.CATEGORIES_SUCCEED]: categoriesRequestSucceed,
    [Types.CATEGORIES_FAILED]: categoriesRequestFailed
})



index.js(redux)

import { takeLatest, all } from 'redux-saga/effects'
//import API from '../Services/Api'
import FixtureAPI from '../Services/FixtureApi'
import DebugConfig from '../Config/DebugConfig'
import ZomatoAPI from '../Services/ZomatoAPI'

/* ------------- Types ------------- */

import { StartupTypes } from '../Redux/StartupRedux'
import { GithubTypes } from '../Redux/GithubRedux'
import { ReactRestoTypes } from '../Redux/ReactRestoRedux'

/* ------------- Sagas ------------- */

import { startup } from './StartupSagas'
import { getUserAvatar } from './GithubSagas'
import { getCategories } from './ReactRestoSagas'

/* ------------- API ------------- */

// The API we use is only used from Sagas, so we create it here and pass along
// to the sagas which need it.
const api = DebugConfig.useFixtures ? FixtureAPI : ZomatoAPI.create()

/* ------------- Connect Types To Sagas ------------- */

export default function * root () {
  yield all([
    // some sagas only receive an action
    takeLatest(StartupTypes.STARTUP, startup),

    // some sagas receive extra parameters in addition to an action
    takeLatest(GithubTypes.USER_REQUEST, getUserAvatar, api),

    takeLatest(ReactRestoTypes.CATEGORIES_REQUEST, getCategories)
  ])
}



ReactRestoSagas.js

import { call, put } from 'redux-saga/effects'
import { path } from 'ramda'
import ReacRestoActions from '../Redux/ReactRestoRedux'
import ReactRestoAPI from '../Services/ZomatoAPI'

const api = ReactRestoAPI.create()

export function* getCategories(){
    const response = yield call(api.getCategories)
    if(response.ok){
        //ok, call action from redux
        yield put(ReacRestoActions.categoriesSucceed(payload))
    }else{
        yield put(ReacRestoActions.categoriesFailed())
    }
}



index.js(佐贺)

import { takeLatest, all } from 'redux-saga/effects'
//import API from '../Services/Api'
import FixtureAPI from '../Services/FixtureApi'
import DebugConfig from '../Config/DebugConfig'
import ZomatoAPI from '../Services/ZomatoAPI'

/* ------------- Types ------------- */

import { StartupTypes } from '../Redux/StartupRedux'
import { GithubTypes } from '../Redux/GithubRedux'
import { ReactRestoTypes } from '../Redux/ReactRestoRedux'

/* ------------- Sagas ------------- */

import { startup } from './StartupSagas'
import { getUserAvatar } from './GithubSagas'
import { getCategories } from './ReactRestoSagas'

/* ------------- API ------------- */

// The API we use is only used from Sagas, so we create it here and pass along
// to the sagas which need it.
const api = DebugConfig.useFixtures ? FixtureAPI : ZomatoAPI.create()

/* ------------- Connect Types To Sagas ------------- */

export default function * root () {
  yield all([
    // some sagas only receive an action
    takeLatest(StartupTypes.STARTUP, startup),

    // some sagas receive extra parameters in addition to an action
    takeLatest(GithubTypes.USER_REQUEST, getUserAvatar, api),

    takeLatest(ReactRestoTypes.CATEGORIES_REQUEST, getCategories)
  ])
}



然后我收到了这个错误: enter image description here

我希望我能得到任何帮助,被困在这里好几个小时

1 个答案:

答案 0 :(得分:0)

问题出在您的ReactRestoRedux.js

const { Types, Creators } = createActions({
    categories: null,
    categoriesSucceed: ['payload'],
    categoriesFailed: null
})

不匹配
export const reducer = createReducer(INITIAL_STATE, {
    [Types.CATEGORIES_REQUEST]: categoriesRequest,
    [Types.CATEGORIES_SUCCEED]: categoriesRequestSucceed,
    [Types.CATEGORIES_FAILED]: categoriesRequestFailed
})

您已将categories键修改为categoriesRequest,如下所示

const { Types, Creators } = createActions({
    categoriesRequest: null,
    categoriesSucceed: ['payload'],
    categoriesFailed: null
})

参考:https://github.com/infinitered/reduxsauce#createactions