我是 Redux Saga 的新手,来自 Redux Thunk。在某些情况下,我需要从调用操作的视图内部了解 API 调用是失败还是成功。使用 Redux Thunk,我将执行以下操作。
我的组件和动作创建者看起来像这样:
class MyComponent extends Component {
componentDidMount() {
this.props.actions.fetchItems()
.then(result => {
if (result.status === 'OK') {
console.log('Request succeeded, take particular action in this view')
}
else {
console.log('Request failed, take other action in this view')
}
})
}
render() {
return (
<div>My view</div>
)
}
}
const mapStateToProps = (state, ownProps) => {
return {
items: state.items,
}
}
const mapDispatchToProps = dispatch => {
return {
actions: bindActionCreators({
...actions,
}, dispatch),
}
}
export default connect(
mapStateToProps,
mapDispatchToProps,
)(MyComponent)
import * as t from './actionTypes'
import {CALL_API} from '../api'
const xhrGetItems = (params) => (dispatch, getState) => {
const action = {
[CALL_API]: {
type: t.XHR_ITEMS_FETCH,
endpoint: `http://www.example.com/myendpoint`,
method: 'get',
}
}
return dispatch(action)
}
我的 API 中间件使用一个CALL_API
属性捕获所有操作,使用 ajax 库进行适当的调用,然后返回一个已履行的Promise。我的减速器设置为处理 api 调用的每个可能状态(成功、失败、挂起)。一直以来,我仍然可以在我的视图中检查调用的结果。
所以我的问题是,如何使用 Redux Saga 实现这一点?现在我的 saga api 中间件正在做它应该做的一切,但是当我fetchItems()
在视图中调用时,结果是一个普通的 JS 对象,所以我无法检查它是否成功。
我也有可能完全错了。非常感谢任何建议。