比如有两个action
export const action1 = (actionData) => {
return dispatch => {
return fetch1(actionData)..then((result) => {
dispatch({
type: 'FETCH1_SUCCESS',
payload: result
})
}).catch((err) => {
dispatch({
type: 'FETCH1_FAILED',
payload: err
})
});
}
}
export const action2 = (actionData) => {
return dispatch => {
return fetch1()..then((result) => {
dispatch({
type: 'FETCH2_SUCCESS',
payload: result
})
}).catch((err) => {
dispatch({
type: 'FETCH2_FAILED',
payload: err
})
});
}
}
如果有的地方action1执行完要立刻执行action2,有的地方只要执行action1,我是应该这样做吗?
export const action3 = (actionData1, actionData2) => {
return dispatch => {
return fetch1(actionData1)..then((result) => {
dispatch({
type: 'FETCH1_SUCCESS',
payload: result
})
dispatch(action2(actionData2));
}).catch((err) => {
dispatch({
type: 'FETCH1_FAILED',
payload: err
})
});
}
}
还是先先渲染第一个组件,在根据第一个组件渲染第二个组件
const mapState = state => {
return {
action1Reducer: state.action1Reducer,
action2Reducer: state.action2Reducer
}
}
const mapDispatch = dispatch => {
return {
action1(data) {
dispatch(action1(data));
}
action2(data) {
dispatch(action2(data));
}
}
}
connect(
mapState,
mapDispatch
)(Comp1);
class Comp1 extends React.Component{
componentDidMount() {
//data是传入
this.props.action1(data);
}
render() {
const { action1Reducer, children } = this.props;
return (
action1Reducer
? <Comp2 />
: null
)
}
}
class Comp2 extends React.Component{
componentDidMount() {
//data是传入
this.props.action2(data);
}
render() {
return (
<div></div>
)
}
}
<Comp1></Comp1>