reactjs - 在反应类组件方法中等待完成 redux-saga
问题描述
如果这是一个重复的问题,我很抱歉,但我已经搜索了这个问题,但没有找到完全解决我的问题的答案。我想在 sagas 中获取数据并在获取数据localStorage
后进行更新。然后我想this.forceUpdate()
在我的组件方法中。但显然this.forceUpdate()
功能是在加载数据之前启动的。我可以将我的handleSubmit
类方法包装成 promise 或 async/await 以this.forceUpdate()
等待获取数据吗?谢谢你。
FETCHING FUNCTION
export const fetchAuth = data => {
return axios({
method: "post",
url: "http://url/",
headers: {},
data: {
email: data.email,
password: data.password.toString()
}
}).then(response => {
return response.data;
});
};
REDUX-SAGA
export function* authRequestFlow(action) {
try {
const tokens = yield call(fetchAuth, action.payload);
if (tokens) {
yield call(save, "access", tokens.access);
yield call(save, "refresh", tokens.refresh);
yield call(save, "isAuthorized", true);
yield put(authSuccess());
}
} catch (error) {
yield put(authFailure(error.message));
}
}
COMPONENT
class Login extends PureComponent {
handleSubmit = () => {
authRequest();
this.forceUpdate();
};
render() {
if (localStorage.getItem("isAuthorized") === "true")
return <Redirect to="/products" />;
return (
<div className={styles.root}>
<Button
onClick={this.handleSubmit}
>
Submit
</Button>
</div>
);
}
}
解决方案
推荐阅读
- php - PHP 中的 VideoStream 外部 URL mp4 文件
- java - 使用 REST Assured,我如何验证 Json 对象数组中的数据类型
- python-3.x - 如何在 django-import-export 中导出 ForeignKeyWidget
- azure - 如何在 Azure DevOps yaml 管道中设置环境状态
- python - 我在这里错过了什么,欧拉项目上的自我权力问题
- bazel - bazel:获取并解包额外的包?
- node.js - 获得未处理的拒绝(TypeError):无法读取未优化的属性“AED”
- python - 在 SSL 上使用相同域运行 Django/Python 电子商务网站和 Php 支付网关
- java - Android 平滑的音频波形
- node.js - 带有 discord.js 的 SQL Server