series-query

解决的问题

1. 参数保留，即保证连续请求，最初设置的初始参数不会变化，在翻页时比较有用
2. 时序保证，连续请求只保留最后一次数据，不会因为接口返回顺序不同导致数据显示不正确
3. 解决多次请求时 loading 在中途取消问题

下面是示例，其中未使用本库之前简单的表格翻页 BUG 如下
（其中第一页返回结果延迟1s, 第二页 2s，第三页 3s， 第四页 4s，代码可在示例网站中查看源代码）：


使用本库之后的结果：


使用方式

$3

- stale: 保证参数不变化，默认为 true
- onlyLatest: 只保留最新一次的返回，只要不是最后一次请求的结果全部丢弃，默认为 false
- func: 查询执行的函数, 必传
- varyKeys: 每次查询中可能会变化的键值，默认 ['page_size', 'page_num']
- onLoadingChange: loading 状态变化函数，只在没有查询时和启动查询时变化，接收参数为 boolean

$3

- query(params) => Promise 发起连续查询
- setQueryParams(params) => void 设置需要固化的参数
- getStaleParams() => void 获取除可变参数外的参数
- setGlobalOptions(options) => void 设置全局的默认参数，必须在 new 实例之前执行

SeriesOrderError 是重复的错误对象，其请求值挂在 data 下，需要自行判断是否丢弃该值，可参见后续的示例

$3

即保证参数不变化
``javascript
// 创建实例，在请求之前创建实例
this.pageQuery = new SeriesQuery({
func: apiFetch,
onLoadingChange: (val) => {
this.loading = val
}
})

// 填入需要固定的查询参数 params
this.pageQuery.setQueryParams(this.filter)

// 查询分页的列表
getList () {
const params = {
page_size: this.page.page_size,
page_num: this.page.page_num,
}
return this.pageQuery.query(params)
.then((res) => {
if (res instanceof Error && res.name === 'SeriesOrderError') {
return
}
if (res.error_no !== 0) {
alert('error')
return
}
this.list.data = (res.data && res.data.list) || []
})
}
// 获取除可变参数外的数据
this.pageQuery.getStaleParams()

`

$3

此模式下无需设置 stale 内的参数，即保证每次查询参数都是最新的

`javascript
this.pageQuery = new SeriesQuery({
func: apiFetch,
onLoadingChange: (val) => {
this.loading = val
},
stale: false
})

// 查询分页的列表
getList () {
const params = {
otherKey: 'value',
page_size: this.page.page_size,
page_num: this.page.page_num,
}
return this.pageQuery.query(params)
.then((res) => {
if (res instanceof Error && res.name === 'SeriesOrderError') {
return
}
if (res.error_no !== 0) {
alert('error')
return
}
this.list.data = (res.data && res.data.list) || []
})
}
``

畅想

支持上一请求的取消
防止重复发请求