reactjs - Redux 传奇 "rootSaga has been cancelled"

Question

我是 React 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)          
]

}

登录和注册对我来说非常适合，但之后我在控制台中收到以下错误消息。因此，即使我可以使用 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.

Answer 1

该错误来自 signIn saga 中的 yield call(somefunc, ...)。它表示 someFunc (无论它在代码中具有什么名称)未定义。因此，您应该检查您是否没有拼写错误的函数名称，或者是否省略了从其定义模块中导出它

编辑

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

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

您不应该自己调用该函数，而应将函数本身以及参数(最终是 this 上下文)提供给 saga

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

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