Question

我是Redux Saga的新手。我想阻止进一步传播的动作。我正在实现行级自动保存机制。我使用saga来检测行切换操作，然后提交行更改并插入当前行更改操作。像这样的代码：

// action-types.js
export const 
    SWITCH_ROW='SW_ROW',
    CHANGE_CUR_ROW='CHG_CUR_ROW';

// actions.js
import {SWITCH_ROW,CHANGE_CUR_ROW} from './action-types'
export const switchRow=(oldRow,newRow)=>({type:SWITCH_ROW,oldRow,newRow})
export const changeRow=(row)=>({type:CHANGE_CUR_ROW,row})

// component.js
class MyComponent extends Component{
    switchRow=(row)=>{
        var oldRow=this.props.curRow;
        this.props.dispatc(switchRow(oldRow,row));
    }
    render(){
        ...
        {/* click on row */}
        <div onClick={()=>this.switchRow(row)}>...</div>
        ...
    }
}

// sagas.js
import {SWITCH_ROW} from './action-types'
import {changeRow} from './actions'
function* switchRow({oldRow,newRow}){
    // Here I want to stop propagating SWITCH_ROW action further
    // because this action is only designed to give saga a intervention 
    // point but not to be handled in reducer. I want a statement like 
    // below:    
    // stopPropogate();
    if(oldRow && oldRow.modified===true){
        yield call(svc.submit, oldRow);
    }
    yield put(changeRow(newRow))
}

export default function*(){
    yield takeEvery(SWITCH_ROW,switchRow)
}

我知道我可以忽略reducer中的SWITCH_ROW动作。但是，我认为程序中的往返次数越少越好。有什么建议吗？

Answer 1

在阅读了有关Redux中间件的更多信息之后，我认为最好使用中间件来实现这一目标。

首先，我将所有特殊动作的类型名称重命名为传奇，使它们全部以SAGA_开头。然后，我使用Redux中间件来识别它们并吞下它们，然后这些特殊动作再也无法到达reducer了。这是代码：

// glutton.js
const glutton = () => next => action => {
    if (!action.type.startsWith('SAGA_')) return next(action);
}  

// store.js
...
const store = createStore(rootReducer, applyMiddleware(sagaMiddleWare, glutton, logger));

Answer 2

让我们说您位于一个不是redux组件的文件中，我的意思是您无权访问dispatch，所以我认为抛出错误会很不错，这是在任何地方捕获异常的代码：

...
case 'SET_INVOICE':
  console.log(action.invoice); //File Object
  return { ...state, invoice: action.invoice};
...

所有sagas都需要实现此基本功能。

Redux Saga如何阻止动作进一步传播

2 个答案: