在组件中使用mapDispatchToProps
来调用操作是否更有效?在操作创建者中使用store.dispatch
是否更有效?
mapDispatchToProps
示例:
// Component
import React from 'React';
import { connect } from 'react-redux';
import { defaultAction } from './actions';
class MyComponent extends Component {
onClickHandler() {
this.props.dispatch(defaultAction());
}
render() {
return (<div onClick={this.onClickHandler.bind(this)} />);
}
}
function mapDispatchToProps(dispatch) {
return { dispatch };
}
export default connect(mapDispatchToProps)(MyComponent);
// Actions
import { DEFAULT_ACTION } from './constants';
export function defaultAction() {
return {
type: DEFAULT_ACTION,
};
}
store.dispatch()
示例:
// Component
import React from 'React';
import { connect } from 'react-redux';
import { defaultAction } from './actions';
class MyComponent extends Component {
onClickHandler() {
defaultAction();
}
render() {
return (<div onClick={this.onClickHandler.bind(this)} />);
}
}
export default MyComponent;
// Actions
import { DEFAULT_ACTION } from './constants';
import store from './store';
export function defaultAction() {
store.dispatch({
type: DEFAULT_ACTION,
});
}
我的猜测是,使用mapDispatchToProps
而不是将整个./store
导入调度操作效率更高。
答案 0 :(得分:4)
通常建议您使用dispatch
提供的mapDispatchToProps
,而不是将您的动作创建者方法与商店单身人士结合使用。 Here's some in depth discussion about it.