Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/26.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Redux传奇无法在承诺内使用生成器功能?_Javascript_Reactjs_Redux Saga - Fatal编程技术网

Javascript Redux传奇无法在承诺内使用生成器功能?

Javascript Redux传奇无法在承诺内使用生成器功能?,javascript,reactjs,redux-saga,Javascript,Reactjs,Redux Saga,我是一个重演传奇的新手。目前,我正在编写一个简单的登录示例。 看看这些函数: function sendLoginRequest(data) { const headers = { 'Accept': 'application/json' }; const url = LOGIN_URL; const serialize = new FormData(data.event.target); const loginData = { username: serialize.g

我是一个重演传奇的新手。目前,我正在编写一个简单的登录示例。 看看这些函数:

function sendLoginRequest(data) {
  const headers = { 'Accept': 'application/json' };
  const url = LOGIN_URL;
  const serialize = new FormData(data.event.target);
  const loginData = {
    username: serialize.get('email'),
    password: serialize.get('password'),
    client_secret: APP_SECRET_KEY,
    client_id: APP_SECRET_ID,
    grant_type: PASSWORD_GRANT_TYPE,
    scope: '*',
  }

  return axios({
    method: 'POST',
    url: url,
    data: loginData,
    headers: headers,
  });
}

export function* loginRequest(data) {
  yield takeLatest(LOGIN_REQUEST, data => {
    const response = sendLoginRequest(data);
    console.log(response);
    response
      .then(function* (data) {
        console.log(data);
        yield put(LOGIN_SUCCESS, data.data);
      })
      .catch(function* (err) {
        console.log(err);
        yield put(LOGIN_FAILURE, err.response);
      });
  });
}
如果我像这样运行中间件,它的工作就完美了:

const sagaMiddleware = createSagaMiddleware();
const store = createStore(
  rootReducer,
  applyMiddleware(sagaMiddleware)
);
sagaMiddleware.run(loginRequest);
但我又添加了一个新的故事:

export default function* rootSaga() {
    yield all([
        fork(loginRequest),
        fork(loginSuccess),
    fork(loginFailure)
    ]);
}
我运行rootSaga而不是loginRequest saga:

const sagaMiddleware = createSagaMiddleware();
const store = createStore(
  rootReducer,
  applyMiddleware(sagaMiddleware)
);
sagaMiddleware.run(rootSaga);
现在这些新代码根本不起作用。 当我尝试
console.log(响应)时在loginRequest生成器函数中,显示承诺已解决。而且它不会运行然后捕获

有人能帮我把这个弄清楚吗? 谢谢~

请尝试以下内容:

export function* loginRequest(data) {
  yield takeLatest(LOGIN_REQUEST, data => {
    const response = yield call(sendLoginRequest, data);

    if (response.status >= 200 && response.status < 300) {
        yield put(LOGIN_SUCCESS, data.data);
        return;
    }
    yield put(LOGIN_FAILURE, err.response);
  });
}
导出函数*loginRequest(数据){
最新(登录请求,数据=>{
const response=yield调用(sendLoginRequest,数据);
如果(response.status>=200&&response.status<300){
收益投入(登录成功,data.data);
返回;
}
屈服put(登录失败,错误响应);
});
}
需要注意的是
sendLoginRequest
返回一个承诺
redux saga
设计用于承诺而不使用
.then()
。您可以
yield call()
任何返回承诺的函数,并且
redux saga
将在执行下一行代码之前等待承诺得到解决。

请尝试以下操作:

export function* loginRequest(data) {
  yield takeLatest(LOGIN_REQUEST, data => {
    const response = yield call(sendLoginRequest, data);

    if (response.status >= 200 && response.status < 300) {
        yield put(LOGIN_SUCCESS, data.data);
        return;
    }
    yield put(LOGIN_FAILURE, err.response);
  });
}
导出函数*loginRequest(数据){
最新(登录请求,数据=>{
const response=yield调用(sendLoginRequest,数据);
如果(response.status>=200&&response.status<300){
收益投入(登录成功,data.data);
返回;
}
屈服put(登录失败,错误响应);
});
}

需要注意的是
sendLoginRequest
返回一个承诺
redux saga
设计用于承诺而不使用
.then()
。您可以
yield call()
任何返回承诺的函数,并且
redux saga
将在执行下一行代码之前等待承诺得到解决。

我不明白您为什么在这里使用
all
效果,那么导出默认函数*rootSaga(){yield fork(loginRequest)呢;yield fork(loginSuccess);yield fork(loginFailure);}我不明白为什么在这里使用
all
effect,那么导出默认函数*rootSaga(){yield fork(loginRequest);yield fork(loginSuccess);yield fork(loginFailure);}