JDF_ElectronicPublicity_uni/components/homeList/homeList.vue

<template>
	<view v-show="isShow" class="i-h-p100 i-w-v100 i-h-v100 i-flex i-al-center i-jst-center ">
		<view class="i-w-p100 i-h-p100">
			<!-- 学校信息 -->
			<view class="i-w-v100 i-h-p35 i-z-index1 i-flex i-al-center i-jst-center">
				<view class="i-pst-r i-t-center i-c-fff animate__animated" 
				:class="pageStatus===1?'animate__fadeInDown':pageStatus===3?'animate__fadeOutUp':''">
					<view class="" @click="developConfig()">
						<span class="i-fs-70 custom-text">{{title[0]}}</span>
					</view>
					<view class="i-mt-26">
						<span class="i-fs-30 ">{{title[1]}}</span>
					</view>
				</view>
			</view>
			<view class="i-w-p100 i-h-p60 i-z-index1">
				<view class="i-flex i-jst-space-between i-wrap i-w-p80 i-h-p100 i-m-0auto">
					<uni-row class="i-w-p100 animate__animated" 
					:class="pageStatus===1?'animate__fadeInUp':pageStatus===3?'animate__fadeOutDown':''">
						<uni-col :span="8" v-for="(item, index) in list" :key="index"
							class="i-flex i-al-center i-jst-center">
							<view class="i-w-p70" :class="index>2?'i-mt-64':''">
								<view class="i-pst-r i-w-p100" @click="onClick(item)">
									<image class="i-radius-20 i-h-250 i-w-p100" mode="aspectFill" :src="item.type_img">
									</image>
									<view class="i-c-fff i-z-index1 i-pst-a i-t-center i-w-p100 i-t-p35">
										<view>
											<span class="i-fs-26">{{item.title}}</span>
										</view>
										<view class="i-mt-10">
											<span class="i-fs-20">{{item.subtitle}}</span>
										</view>
									</view>
								</view>
							</view>
						</uni-col>
					</uni-row>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "homeList",
		data() {
			return {
				clickCount: 0, // 点击次数计数器
				lastClickTime: 0 // 上次点击的时间戳
			};
		},
		props: {
			list: {
				type: Array,
				default: () => []
			},
			isShow: {
				type: Boolean,
				default: true
			},
			// 页面状态 动画效果 1进入 2正常 3退出
			pageStatus: {
				type: Number,
				default: 2,
			},
			title:{
				type:Array,
				default:()=>[]
			}
		},
		watch: {},
		methods: {
			// 清除缓存
			developConfig() {
				const currentTime = new Date().getTime();

				// 如果两次点击间隔超过1秒，重置计数器
				if (currentTime - this.lastClickTime > 1000) {
					this.clickCount = 0;
				}

				this.clickCount++;
				this.lastClickTime = currentTime;

				// 如果点击次数达到5次，弹出对话框
				if (this.clickCount >= 5) {
					uni.showModal({
						title: '提示',
						content: '已清除缓存，即将重新获取数据',
						showCancel: false,
						success: () => {
							this.clickCount = 0; // 重置计数器
							this.$emit('clearCacheEvent')
						}
					});
				}
			},
			// 点击给父组件传参
			onClick(e) {
				this.$emit('customEvent', e)
			},
		}
	}
</script>

<style>
	.custom-text {
		font-family: 'ysbth', sans-serif;
	}
</style>