概要
最近为了解决项目上接口请求慢而阻塞页面加载的问题,使用了lodash的memoize提前做了接口加载,使用memoize有两个优点
- 可以在首页提前加载数据,只要参数没有变化,后续页面可以直接使用缓存,不必重新请求接口,提升页面效果
- 即使接口返回数据慢,首屏没有加载完就进入到下一页面,这时会在下一页面重新请求接口,不会造成页面报错或崩溃
名词解释
_.memoize(func, [resolver]) 函数可以对一个函数进行记忆化处理,即缓存该函数的计算结果。
func:(Function): 需要缓存化的函数.
[resolver] (Function): 这个函数的返回值作为缓存的 key。
代码部分
// 缓存字典内容
getDictionary = _.memoize(
params=>this.getDictionaryApi(params).then(res=>this.formatData(res)), // 返回一个函数方法作为参数
key
)
// 获取数据
getData() {
const params = { code:''2100000 }
return this.getDictionary(params)
}
// 调用方法
this.getData()