input 框输入后发送异步请求,页面拿到响应进行渲染。但偶尔会遇到问题:响应内容和输入结果不一致。因为 http 无法保证响应到达的顺序。

如何解决呢?提供一个小思路。

myRequest.js

import request from '@/request'

function myRequest (opts) {
if (!opts.pid) throw {message: 'pid 不能为空'} const KEY = Symbol.for(opts.pid)
const requestId = ~~myRequest[KEY] + 1
myRequest[KEY] = requestId return request(opts)
.then(res => {
return myRequest[KEY] === requestId
? res
: null
})
} export default myRequest

我们使用 requestId 标识请求的次数,并将其封装到 myRequest 函数对象内。处理响应时,比较这两个值,若不相等则丢掉。这保证页面渲染的数据始终是最新的

Symbol.for(..) 在全局符号注册表中搜索,来查看是否有描述文字相同的符号已经存在,如果有的话就返回它。如果没有的话,会新建一个并将其返回。

在上例中,Symbol 保证了键的唯一性,也减少了一次判断。

Symbol 小妙处的更多相关文章

  1. 提升 LaTeX 效率的小工具:Detexify LaTeX handwritten symbol recognition

    Detexify LaTeX handwritten symbol recognition 用 LaTeX 的人找符号的表示方法通常很费事,需要去翻长长的列表.Detexify 是一个省事的小网站,只 ...

  2. Source Insight小技巧:修改Symbol Window的默认宽度

    SI是个好东西,但是源代码窗口左边的符号窗口的默认宽度实在是太小,每次打开一个新的源码窗口都要重新拖放调整,很烦人.下面是一劳永逸调整Symbol Window宽度的方法. 打开一个源码窗口,将Sym ...

  3. linux下开发,解决cocos2d-x中编译出现的一个小问题, undefined reference to symbol 'pthread_create@@GLIBC_2.2.5'

    解决cocos2d-x中编译出现的一个小问题 对于cocos2d-x 2.×中编译中,若头文件里引入了#include "cocos-ext.h",在进行C++编译的时候会遇到例如 ...

  4. 微信小程序使用彩色图标(阿里巴巴 iconfont Symbol 的用法)微信小程序使用彩色图标(阿里巴巴 iconfont Symbol 的用法)

    前提 需要安装好 nodejs (略) 用于下载插件 安装插件 npm install mini-program-iconfont-cli --save-dev 初始化配置文件 npx iconfon ...

  5. 【原】IOS合并lib(.a)库的终极可用方法(可用于解决duplicate symbol静态库冲突)

    网上流传了太多关于合并lib库的方法,自己也尝试过,但大多失败.有感于这种急于解决问题,经过百般尝试后依旧无果的无奈心情,小翁在这里用一个实例来完整阐述如何在mac中合并lib静态库. 这里以移动广告 ...

  6. 小知识点总结HTML、CSS、JavaScript(一)

    1.给元素同时设置背景色和背景图的时候,当背景色写在背景图后面,背景色会覆盖背景图未覆盖的位置 如background:url(); background-color:red; 2.当需求一段文字右对 ...

  7. Best Practices for Performance_1、2 memory、Tips 性能和小的优化点、 onTrimMemory

    http://developer.android.com/training/articles/memory.htmlhttp://developer.android.com/tools/debuggi ...

  8. iOS开发中调试小技巧

    对于软件开发而言,调试是必须学会的技能,重要性不言而喻.对于调试的技能,基本上是可以迁移的,也就是说你以前在其他平台上掌握的很多调试技巧,很多也是可以用在iOS开发中.不同语言.不同IDE.不同平台的 ...

  9. 小甲鱼PE详解之IMAGE_NT_HEADERS结构定义即各个属性的作用(PE详解02)

    PE Header 是PE相关结构NT映像头(IMAGE_NT_HEADER)的简称,里边包含着许多PE装载器用到的重要字段.下边小甲鱼将为大家详细讲解哈~ (视频教程:http://fishc.co ...

随机推荐

  1. from import语句

    *)假如导入出现了问题,那么一定是导入的文件里的语法问题或者其他问题 参考链接:http://www.cnblogs.com/hwf-73/p/5493328.html 1)导入时重命名 as fro ...

  2. python--线程和进程的初识

    一.进程与线程之间的关系 1.线程是属于进程的,线程运行在进程空间内,同一进程所产生的线程共享同一内存空间,当进程退出时该进程所产生的线程都会被强制退出并清除. 2.线程可与属于同一进程的其它线程共享 ...

  3. 基础系列(1)-- html

    (随笔杂谈,自己做的笔记) 网页的组成 结构  ------  xhtml,xml 表现  ------  css 行为  ------  bom,dom,ECMAScript html5结构 < ...

  4. 监控微信小程序中的慢HTTP请求

    摘要: 请求时间太长,影响用户体验,使用 Fundebug 监控慢请求. Fundebug 的微信小程序监控插件在 0.5.0 版本已经支持监控 HTTP 请求错误,在小程序中通过wx.request ...

  5. Git恢复删除的分支

    1.使用 git reflog 命令查看显示整个本地仓储的commit,包括所有branch的commit,甚至包括已经撤销的commit. 2.找到我们想要恢复的分支 ,可以看到我们当时commit ...

  6. datagrid相关

    int rowID = Convert.ToInt32(dataGrid_OpenBoxScan.CurrentRowIndex.ToString());//得到所选行的行号              ...

  7. vue用async、await实现同步请求

    以下是vue method的demo: loadTableData : async function() { var reses = await $.ajax({ type:'post', url:' ...

  8. OpenSSL 安装 (Linux系统)

    OpenSSL 编译安装 操作系统:CentOS 7 OpenSSL Version: openssl-1.1.1d.tar.gz OpenSSL下载地址为:https://www.openssl.o ...

  9. POJ3070 斐波那契数列递推 矩阵快速幂模板题

    题目分析: 对于给出的n,求出斐波那契数列第n项的最后4为数,当n很大的时候,普通的递推会超时,这里介绍用矩阵快速幂解决当递推次数很大时的结果,这里矩阵已经给出,直接计算即可 #include< ...

  10. UGUI:技能冷却效果

    版权申明: 本文原创首发于以下网站: 博客园『优梦创客』的空间:https://www.cnblogs.com/raymondking123 优梦创客的官方博客:https://91make.top ...