promise 异步问题。导致页面没有实时刷新的解决办法:改成同步
2023-09-14 09:04:07 时间
今天排查了好久。还是表哥这个老前端帮我解决了问题:
知识点:
promise 异步对象,和async await,
问题:这个地方在我们关注前后。需要实时变化。虽然我在点击了关注或者取消之后。都去再次请求了数据。但是因为异步的原因。总是慢半拍。每次关注的请求还没执行完。页面就提前去加载数据了。所以有一个加载的先后顺序。在network里面可以看见加载时间和顺序。我们下次避免这种问题就按同步处理就行,需要用到async await,
我的代码:
// 关注问题
async followQuestion() {
await followQuestion(this.questionId)
this.getQuestionDetail(this.questionId);
},//取消关注问题
async unFollowQuestion() {
//await 也就是等待这个请求执行完成了,才执行以下的操作
await unFollowQuestion(this.questionId)
this.getQuestionDetail(this.questionId);
},
import apiRequest from "../utils/request";
// 关注/取消关注问题actionContentId 是 String 被操作的内容的id(关注的问题ID)
export function followQuestion(actionContentId) {
let userInfo = JSON.parse(sessionStorage.getItem("userInfo"));
// console.log(userInfo)
// 这里就是promise 对象return出去了,只有它能 await
return apiRequest("post", "qas/api/action/questionOpt", {
actionUserId: userInfo.userid,//操作人id注意id是小写的
actionType: 2,//操作类型。2是关注
actionContentId: actionContentId,//被操作的内容的id(关注的问题ID)
}).then((res) => {
// console.log(res)
if (res.state === 200) {
console.log("关注问题成功!")
}
}).catch((err) => {
if (err) {
console.log(err.message);
}
});
}
//取消关注问题actionContentId 是 String 被操作的内容的id(关注的问题ID)
export function unFollowQuestion(actionContentId) {
let userInfo = JSON.parse(sessionStorage.getItem("userInfo"));
// console.log(userInfo)
return apiRequest("post", "qas/api/action/questionOpt", {
actionUserId: userInfo.userid,//操作人id
actionType: 2,//操作类型。2是关注
actionContentId: actionContentId,//被操作的内容的id(关注的问题ID)
isCancel: true
}).then((res) => {
// console.log(res)
if (res.state === 200) {
console.log("取消关注问题成功!")
}
}).catch((err) => {
if (err) {
console.log(err.message);
}
});
}
相关文章
- 实时即未来,车联网项目之原始终端数据实时ETL【二】
- 实时营销引擎在vivo营销自动化中的实践 | 引擎篇04
- 用websocket实现实时聊天功能
- vue页面刷新方法_vue返回上一页怎么实时刷新
- 大数据NiFi(二十):实时同步MySQL数据到Hive
- SL sensor :一种基于结构光传感器开源且实时用于高精度建筑机器人重建应用方案
- phpstorm 实现SFTP开发,线上线下同步(实时更新代码)
- inotify+rsync数据的实时同步
- Mysql到Elasticsearch高效实时同步Debezium实现
- 继华为后,小米开始内测小爱同学 AI 字幕:实时翻译外语原声视频和直播
- 实现实时消息系统的Redis订阅功能(redis消息订阅)
- MySQL实时数据同步技术研究(mysql数据实时同步)
- Oracle智能在线数据库:实时保障数据安全(oracle在线数据库)
- MySQL数据库的简单方式(mysql实时同步)
- es数据实时同步到Oracle数据库(es同步到oracle)
- 重塑数据库 从Redis缓存到实时访问(数据库与redis缓存)
- Oracle主从实时数据同步双保险有效保障数据完整性(oracle主从实时同步)
- Redis写时复制海量数据实时保存(写时复制Redis)
- 同步实时同步Redis集群数据,简化运维(Redis集群 数据实时)
- Oracle VKTM开启实时数据库管理新时代(oracle vktm)