在 redux 中调用(辅助)函数
Calling (helper) function in redux
我正在使用 react-native-router-flux 和 react-redux,我想我应该在这里问这个问题,如果我错了请纠正我。
我有 ActivityModal 容器,只要有 API 调用或类似的东西,我就会调用它来显示该模态。目前我是这样称呼它的:
Actions.refresh({key: 'activityModal', visible: true});
显示和
Actions.refresh({key: 'activityModal', visible: false});
隐藏。
这可行,但我更愿意提出一些更优雅的解决方案。我添加了两个动作(用于显示和隐藏)并在那里添加了那些代码行并且它有效但我不确定这是否是正确的方法(并且不使用减速器,只有动作 - 我是 redux 的新手) .我正在考虑另一种方法来做到这一点:在我将进行这些 Actions.refresh 调用的地方添加一些辅助函数,并在我需要访问 activityModal 可见性的地方导入它们。
请告诉我或建议我最正确的方法是什么?
谢谢!
编辑:
我成功了,但我希望您确认这是否是一种好的做法。这是我所做的:
containers/LoginContainer.js
...
this.props.showActivityModal(); // calling this on button press
...
actions/activityModal.js
...
export function showActivityModal() {
return {
type: types.ACTIVITY_MODAL_SHOW,
payload: {}
}
}
...
reducers/activityModal.js
...
return {
visible: true,
text: ''
};
...
components/ActivityModal.js
...
class ActivityModal extends Component {
...
componentWillReceiveProps(nextProps) {
this.setState({
visible: nextProps.activityModal.visible
})
}
...
}
function mapStateToProps(state) {
return {
activityModal: state.activityModal
};
}
export default connect(mapStateToProps)(ActivityModal);
谢谢!
要做到我想要的,我所要做的就是:
function mapStateToProps(state) {
return {
activityModal: state.activityModal
};
}
export default connect(mapStateToProps)(ActivityModal);
我想更改组件的状态。并分派一个动作来实际改变 activityModal 的状态。
我猜这是 react redux 的正常行为,但我刚开始时走错了路,但是嘿,我想通了。
我正在使用 react-native-router-flux 和 react-redux,我想我应该在这里问这个问题,如果我错了请纠正我。
我有 ActivityModal 容器,只要有 API 调用或类似的东西,我就会调用它来显示该模态。目前我是这样称呼它的:
Actions.refresh({key: 'activityModal', visible: true});
显示和
Actions.refresh({key: 'activityModal', visible: false});
隐藏。
这可行,但我更愿意提出一些更优雅的解决方案。我添加了两个动作(用于显示和隐藏)并在那里添加了那些代码行并且它有效但我不确定这是否是正确的方法(并且不使用减速器,只有动作 - 我是 redux 的新手) .我正在考虑另一种方法来做到这一点:在我将进行这些 Actions.refresh 调用的地方添加一些辅助函数,并在我需要访问 activityModal 可见性的地方导入它们。
请告诉我或建议我最正确的方法是什么?
谢谢!
编辑: 我成功了,但我希望您确认这是否是一种好的做法。这是我所做的:
containers/LoginContainer.js
...
this.props.showActivityModal(); // calling this on button press
...
actions/activityModal.js
...
export function showActivityModal() {
return {
type: types.ACTIVITY_MODAL_SHOW,
payload: {}
}
}
...
reducers/activityModal.js
...
return {
visible: true,
text: ''
};
...
components/ActivityModal.js
...
class ActivityModal extends Component {
...
componentWillReceiveProps(nextProps) {
this.setState({
visible: nextProps.activityModal.visible
})
}
...
}
function mapStateToProps(state) {
return {
activityModal: state.activityModal
};
}
export default connect(mapStateToProps)(ActivityModal);
谢谢!
要做到我想要的,我所要做的就是:
function mapStateToProps(state) {
return {
activityModal: state.activityModal
};
}
export default connect(mapStateToProps)(ActivityModal);
我想更改组件的状态。并分派一个动作来实际改变 activityModal 的状态。
我猜这是 react redux 的正常行为,但我刚开始时走错了路,但是嘿,我想通了。