Question

佐贺宣言

function* DoStuffInSaga({myRef}){
    try {
        console.info("saga running");

        return yield delay(1000, 1);
    }
    catch(error){
        console.warn(error);
    }
}

export function* mySaga(){
    yield all([
        yield takeLatest(DO_STUFF_ACTION, DoStuffInSaga)
    ]);
}

Saga从index.js曝光

export { mySaga } from './mySaga';

Saga init

import * as sagas from './';

const initSagas = (sagaMiddleware) => {
    (Object.keys(sagas).map(key => sagas[key])||[]).forEach(sagaMiddleware.run.bind(sagaMiddleware));
}

export default initSagas;

如果我记录了Object.keys（sagas），列表中会提到saga，所以我认为Saga已经开始了。

从商店调用此函数：

initSagas(sagaMiddleWare);

动作调用

我有一个演示组件来执行此操作：

import { doStuff } from '../../actions';

function mapDispatchToProps(dispatch) {
    return {
        doStuff: () => dispatch(doStuff())
    };
}

doStuff 的位置是：

export const DO_STUFF_ACTION = 'DO_STUFF_ACTION';

export function doStuff(myRef) {
    console.info('At doStuff action', myRef);
    return { type: DO_STUFF_ACTION, myRef };
}

从材质UI图标中调用该操作点击：

import { doStuff } from '../../actions';

function DoStuff(){
    doStuff('my-ref-key');
}

<Print className={classes.iconWithText} onClick={DoStuff} />

我的问题

“在doStuff动作”正在被记录，它看起来（对我来说）像Saga应该正在运行，但它似乎没有听到进来的动作，因为传奇没有记录任何东西。我错过了什么？

更新

它与调用所需操作的方式有关。现在它是通过图标点击触发的，如果我在当前页面组件的componentDidMount上触发它，则传奇被称为正常。

Answer 1

也许我在这里遗漏了一些东西，但这对我来说很有趣：

export function* mySaga(){
    yield all([
        yield takeLatest(DO_STUFF_ACTION, DoStuffInSaga)
    ]);
}

documentation显示正在使用的takeLatest：

function* mySaga() {
  yield takeLatest("USER_FETCH_REQUESTED", fetchUser);
}

所以我希望你的看起来很相似：

function* mySaga() {
  yield takeLatest(DO_STUFF_ACTION, DoStuffInSaga);
}

Redux saga没有听取图标点击触发的动作

1 个答案: