cube-ui indexList的正确使用
2024-10-07 00:08:27
demo地址:https://github.com/zphtown/cube-ui-bug
上拉和下拉核心代码:
onPullingDown () {
this.isNoMore = false
this.from = 1
this.getList(1)
},
onPullingUp () {
if (this.isNoMore) {
this.$refs.indexList.forceUpdate()
return
}
this.getList()
},
getList (isUpdate) {
axios.get('http://api.zphtown.com/getGoldList.php', {
params: {
from: this.from,
size: this.size
}
})
.then(res => {
const { list } = res.data
const len = list.length
let arr = []
list.map(v => {
let time = parseTime(v.createTime, '{y}年{m}月')
let index = arr.findIndex(v2 => v2.name === time)
if (index === -1) {
arr.push({
name: time,
items: []
})
}
arr[index > -1 ? index : arr.length - 1].items.push(v)
})
if (isUpdate) {
if (len) {
this.list = arr
} else {
this.$refs.indexList.forceUpdate()
}
} else {
arr.map(v => {
let index = this.list.findIndex(v2 => v2.name === v.name)
if (index > -1) {
this.list[index].items.push(...(v.items))
} else {
this.list.push(v)
}
})
if (len) {
if (len === this.size) {
setTimeout(() => {
this.$refs.indexList.forceUpdate(true)
}, 30)
} else {
console.log('nodata')
this.isNoMore = true
setTimeout(() => {
this.$refs.indexList.forceUpdate(true, true)
}, 30)
}
} else {
this.$refs.indexList.forceUpdate()
this.isNoMore = true
}
this.from++
}
})
}
}
划重点:
最新文章
- javascript的假查询
- JavaScript初学者应注意的七个细节(转)
- watchdog机制
- Red5边源服务器集群部署
- u-boot中分区和内核MTD分区关系
- [Typescript] Function defination
- MVC4过滤器(转)
- 积累的VC编程小技巧之文件操作
- ThinkPhp学习13
- MATLAB符号极限、导数及级数求和
- Vue 表单验证插件
- pouchdb-all-dbs插件
- 简单的GIT上传
- 在MVC中Dashboard基础入门操作
- 雅礼 noip2018 模拟赛 day3 T3
- java用poi读取Excel表格中的数据
- jzoj3084
- Python标准库 之 turtle(海龟绘图)
- poj 2155 (二维树状数组 区间修改 求某点值)
- ubuntu下访问支付宝官网,安装安全控件