1.直接动用声明周期 需要先在pack.json中配置位置

![在这里插入图片描述](https://img-blog.csdnimg.cn/5f8faf46d24544e28f83e482b36e8cc7.png
然后在页面中 配合声明周期使用

export default {
		data() {
			return {
				content_detailList: [{
						content: '我校经管党支部开展党的十九届六中全会精学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					},
					{
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					}, {
						content: '我校经管党支部开展党的十九届六中全会精神专题学习我校经管党支部开展党的十九届六中全会精神专题学习',
						time: '2021-11-21 24:24',
						img: '../../static/index_img/01.png'
					},
				],
				loadingType: 0,
				num: 0,
			}
		},
		methods: {
			getData() {
				console.log(1, 130)
				if (this.loadingType != 0) return
				this.loadingType = 1
				if (this.num == 2) {
					this.loadingType = 2
					return
				}
				setTimeout(res => {
					
					this.num++
					this.content_detailList = this.content_detailList.concat(this.content_detailList)
					this.loadingType = 0
				}, 3000)
				console.log(1, this.num, this.loadingType)
			},
		},
		onReachBottom() {
			this.getData()
		}

	};

2.scroll-view
详见 uniapp scroll-view地址

 <scroll-view class="orderlist" scroll-y="true" lower-threshold="30" @scrolltolower="scrollLower">
      <view class="haha" v-for="(item,index) in dataList" :key="index">{{ item.institutionName }}</view>
      <uni-load-more :status="status"></uni-load-more>
    </scroll-view>

示例

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐