过去几个月里,我一直在学习React and Flux,有一件我还没有处理的问题是向用户显示错误信息.具体来说,作为通量动作创建者方法中的ajax http请求的结果而发生的错误消息.
一个简单的例子是用户登录 – 如果ajax请求的登录由于密码不正确而失败,则服务器会以失败方式进行响应.在那一刻,在我的助动作创建者方法中,我唯一的选择是发送一个包含错误信息的动作,对吧?
我可以发送错误信息并将该错误保存在商店中.我不知道把某些错误与某些组件绑在一起的最佳方法是.说我的反应组件树正在呈现多个错误感知组件,但在服务器端用户身份验证尝试期间发生错误,需要在该登录表单上显示.
有没有很好的模式或惯例存储错误,并知道他们是哪个组件?是否有一种程序化的方式来确定这一点,而不是将一些标识符传递给每个动作创建者功能,以识别动作创建者称之为组件等等?
解决方法
由于您使用Redux标记标记问题,我假设您使用Redux.
如果是这样,这个 real-world example显示错误处理.
如果是这样,这个 real-world example显示错误处理.
有一个reducer that reacts to any action with error
field:
// Updates error message to notify about the Failed fetches. function errorMessage(state = null,action) { const { type,error } = action; if (type === ActionTypes.RESET_ERROR_MESSAGE) { return null; } else if (error) { return action.error; } return state; }
自定义API中间件puts any error message into error
field on the action:
return callApi(endpoint,schema).then( response => next(actionWith({ response,type: successtype })),error => next(actionWith({ type: failureType,error: error.message || 'Something bad happened' })) );
最后组件reads the error message from Redux store:
function mapStatetoProps(state) { return { errorMessage: state.errorMessage }; }
原文地址:https://www.jb51.cc/js/153185.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。