Redux传奇“rootSaga已被取消”

时间:2016-08-27 16:02:12

标签: reactjs redux redux-saga

我是新来的反应redux。 只是尝试Redux Saga并遇到一些我无法理解的错误消息。 这是我的rootSaga:

import { takeEvery } from 'redux-saga';
import { AUTH_LOAD_SUCCESS,AUTH_SIGNUP,AUTH_SIGNIN,AUTH_SIGNOUT } from '../reducers/auth';
import { receiveAuth,signUp,signIn,onSignOut } from './auth';

export default function* rootSaga(){
    yield [
        takeEvery('AUTH_LOAD_SUCCESS', receiveAuth),
        takeEvery('AUTH_SIGNUP', signUp),
        takeEvery('AUTH_SIGNOUT',onSignOut),
        takeEvery('AUTH_SIGNIN', signIn)          
]

}

SignIn和SignUp对我来说非常合适,但之后我在控制台中收到以下错误消息。所以,即使我可以使用redux-saga登录,但我无法让SignOut工作,大概是因为saga根据错误消息被“取消”。有人可以向我解释发生了什么事吗?感谢

bundle.js:79457 uncaught at check call: argument fn is undefinedlog @ bundle.js:79457
bundle.js:79457 rootSaga has been cancelled 
bundle.js:79457 uncaught at rootSaga 
 at rootSaga 
 at signIn 
 Error: call: argument fn is undefined
    at check (http://127.0.0.1:3000/dist/bundle.js:79313:12)
    at getFnCallDesc (http://127.0.0.1:3000/dist/bundle.js:80311:21)
    at call (http://127.0.0.1:3000/dist/bundle.js:80336:24)
    at signIn$ (http://127.0.0.1:3000/dist/bundle.js:81213:47)
    at tryCatch (http://127.0.0.1:3000/dist/bundle.js:7893:41)
    at GeneratorFunctionPrototype.invoke [as _invoke] (http://127.0.0.1:3000/dist/bundle.js:8167:23)
    at GeneratorFunctionPrototype.prototype.(anonymous function) [as next] (http://127.0.0.1:3000/dist/bundle.js:7926:22)
    at next (http://127.0.0.1:3000/dist/bundle.js:79727:28)
    at currCb (http://127.0.0.1:3000/dist/bundle.js:79801:8)
    at http://127.0.0.1:3000/dist/bundle.js:79904:17

额外信息:

sagas/auth.js
import 'babel-polyfill';
import fetch from 'isomorphic-fetch'
import { browserHistory } from 'react-router';
import cookie from 'react-cookie';
import { put,call,select } from 'redux-saga/effects';
import { requestSignUp,requestSignIn,requestSignOut,receiveUser,receiveSignIn,receiveSignOut } from '../reducers/auth'



export function* onSignOut(){

/////////////////ignore this for the moment///////
 console.log("ffss")

}

export function* receiveAuth() {
    const user = cookie.load('username');

    yield put(receiveAuth(user));
    }

export function* signUp(action) {
    yield put(requestSignUp())
    try {
        const response = yield call(fetch,'/api/sign_up', {
                    method:'POST',
                    headers:{'Accept': 'application/json', 'Content-Type': 'application/json'},
                    body: JSON.stringify(action.payload)  /////action.payload contains {username:'aa',password:'aa'}
                    })
        if(response.ok){
            yield call(cookie.save,'username', action.payload.username)
            yield put(receiveUser(action.payload.username))
            yield call(browserHistory.push('/chat'))
        }
    } catch (err){
        throw err
      }       
}

export function* signIn(action) { console.log("hi")
    yield put(requestSignIn())
    try {

        const response = yield call(fetch,'/api/sign_in', {
                method:'POST',
                headers:{'Accept': 'application/json', 'Content-Type': 'application/json'},
                body: JSON.stringify(action.payload)  /////action.payload contains {username:'aa',password:'aa'}
                })


        if(response.ok){
             yield call(cookie.save,'username',action.payload.username)
            yield put(receiveSignIn(action.payload))
            yield call(browserHistory.push('/chat'))
        }
    } catch (err){
        throw err
      }
}

我想我应该在第二个参数中调用,但是当我编码为null时yield call(browserHistory.push('/chat'),null)我仍然会得到错误

uncaught at signIn call: argument fn is undefined
uncaught at check call: argument fn is undefined

另外,我的receiveAuth正在返回此消息:

uncaught at rootSaga 
 at rootSaga 
 at receiveAuth 
 Error: Actions must be plain objects. Use custom middleware for async actions.

1 个答案:

答案 0 :(得分:17)

错误来自yield call(somefunc, ...)传奇中的signIn。它说someFunc(代码中没有任何名称)是未定义的。因此,您应该检查是否有错误的函数名称,或者可能省略它从定义模块中导出它

修改

我注意到你像这样调用了browserHistory.push函数

yield call(browserHistory.push('/chat'),null)

你不应该自己调用这个函数,而是将函数本身连同参数(最后是这个上下文)一起提供给saga

yield apply(browserHistory, browserHistory.push, ['/chat'])   

我使用apply Effect允许调用带有this上下文的方法(上下文作为第一个参数提供)