前端需调用后端数据作为判断条件

前端需调用后端数据作为判断条件

  • 一、需求场景
  • 二、实现逻辑
    • [2.1 使用computed+ watch实现](#2.1 使用computed+ watch实现)
    • [2.2 使用setTimeout实现](#2.2 使用setTimeout实现)
    • [2.3 使用methods代替computed](#2.3 使用methods代替computed)
    • [2.4 具体方案需要根据computed、watch、methods的优缺点去实现](#2.4 具体方案需要根据computed、watch、methods的优缺点去实现)

一、需求场景

  • 需求分析:前端需要后端返回的的数据做为前端的判断条件

思考

1.后端数据是异步的

2.前端如何将拿到的异步数据放入同步的函数中做为条件判断且需要实时监听是否更新

二、实现逻辑

2.1 使用computed+ watch实现

  • 前端使用computed进行计算: 但是computed不能异步,它是有缓存的,所以此时需要借助watch进行辅助监听
  • watch中监听后端数据是否有返回: 若有返回则设置flag字段告知前端,后端已返回数据,可使用该条件进行判断

2.2 使用setTimeout实现

  • 借助setTimeout实现数据更新

2.3 使用methods代替computed

  • methods代替: 即在methods中进行请求后端接口作为条件判断,但此方案存在性能问题

2.4 具体方案需要根据computed、watch、methods的优缺点去实现

相关推荐
2501_946675646 分钟前
Flutter与OpenHarmony打卡步进器组件
java·javascript·flutter
tjswk20089 分钟前
在ios上动态插入元素的列表使用:last-child样式可能不能及时生效
前端
小小荧11 分钟前
CSS 写 SQL 查询?后端慌了!
前端·sql
小高00712 分钟前
🔥3 kB 换 120 ms 阻塞? Axios 还是 fetch?
前端·javascript·面试
千寻girling14 分钟前
面试官 : “ Vue 选项式api 和 组合式api 什么区别? “
前端·vue.js·面试
小二·17 分钟前
从零手写《超级玛丽》——前端 Canvas 游戏开发与物理引擎
前端·游戏
da_vinci_x21 分钟前
【2D场景】16:9秒变21:9?PS “液态缩放” + AI 补全,零成本适配全面屏
前端·人工智能·游戏·aigc·设计师·贴图·游戏美术
南知意-37 分钟前
3.3K Star ! 超级好用开源大屏设计器!
前端·开源·开源项目·工具·大屏设计
华仔啊1 小时前
Vue 组件通信的 8 种最佳实践,你知道几种?
前端·vue.js