Homestay_manage_app/pagesSub/likeList/likeList.vue

<template>
	<view class="container">
		<view class="list">
			<!-- 每一个用户区域 -->
			<view class="list_box" v-for="item in list" :key="item.id">
				<img mode="aspectFill" :src="item.image" @click="handleGoMyHome(item)" />
				<view class="box_info">
					<view class="info_name">{{ item.name }}</view>
					<view class="info_num">
						<view class="num_article">{{ item.articleNumber }}篇推文</view>
						<view class="num_fans">{{ item.fansNumber }}粉丝</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			// 推文id
			tweetId: null,
			// 列表数组
			list: [],
			// 当前页
			page: 1,
			// 每页多少条
			rows: 20,
			// 总条数
			total: null
		}
	},
	onLoad(options) {
		this.tweetId = options.id
		this.getData()
	},
	onReachBottom() {
		if (this.list.length < this.total) {
			this.page++
			this.getData()
		} else {
			uni.showToast({
				title: '没有更多数据了',
				icon: 'none',
				mask: true
			})
		}
	},
	methods: {
		async getData() {
			const res = await this.$myRequest({
				url: '/mhotel/articlequeryLikes.action',
				data: {
					id: this.tweetId,
					page: this.page,
					rows: this.rows
				}
			})
			// console.log(res)
			if (res.code === 200) {
				this.list = [...this.list, ...res.data.pageList]
				this.total = res.data.total
			}
		},
		handleGoMyHome(item) {
			uni.navigateTo({
				url: `/pagesSub/myHome/myHome?userId=${item.id}`
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	min-height: 100vh;
	background-color: #fff;

	.list {
		padding: 10rpx 20rpx;

		.list_box {
			display: flex;
			align-items: center;
			height: 100rpx;
			border-bottom: 1rpx solid #e5e5e5;

			img {
				width: 60rpx;
				height: 60rpx;
				border-radius: 50%;
			}

			.box_info {
				margin-left: 15rpx;
				font-size: 24rpx;

				.info_name {
					font-weight: bold;
				}

				.info_num {
					display: flex;
					align-items: center;
					margin-top: 5rpx;
					color: #808080;

					.num_article {
					}
					.num_fans {
						margin-left: 30rpx;
					}
				}
			}
		}
	}
}
</style>