我正在构建一个 React 应用程序并正在调用一个自定义处理程序库来调用我们的 REST API。
在这些（非 React）函数中，我想触发 Redux 操作以使用端点响应更新存储，但无法弄清楚如何在没有通常的 'mapDispatchToProps'/connect() 方法的情况下触发 Redux 操作。
这可能吗？
谢谢
是否可以从组件外部触发 Redux 操作？
IT技术
reactjs
redux
react-redux
2021-04-16 07:16:03
2个回答
为了从范围之外进行调度和操作，React.Component您需要获取商店实例并dispatch像这样调用它
import { store } from '/path/to/createdStore';
function testAction(text) {
return {
type: 'TEST_ACTION',
text
}
}
store.dispatch(testAction('StackOverflow'));
我真的很喜欢复制 Promise 使用的 resolve/reject 或 onSuccess/onError 模式。
所以我建议你做同样的事情。您调用自定义处理程序并向其传递 onSuccess 和 onError 回调。因此，当您获取数据时，您可以调用 onSuccess，如果出现错误，您可以调用 onError 回调。
onSuccess 和 onError 是组件中的函数，它们将向用户显示某些内容或执行其他操作（在出现错误时显示错误消息？！）。
让我们看一个例子：
export default class CustomService{
getData(onSuccess, onError){
//axios.get(...) or fetch(...)
if(success) call onSuccess(result)
if(error) call onError(error)
}
}
export default class MyComponent extends React.Component{
constructor(props){
super(props);
this.state = {
showError:false
}
this.customService = new CustomService();
this.onSuccess = this.onSuccess.bind(this);
this.onError = this.onError.bind(this);
}
componentDidMount(){
this.customService.getData(this.onSuccess, this.onError);
}
onSuccess(result){
// Do something if necessary
// Call the redux action
}
onError(error){
//Show a toast message to user or do something else
this.setState({showError:true});
}
}
在 onSuccess 中，您可以调用 Redux 来存储您的数据。