ygoa_miniapp/components/ygoa/attachmentList.vue

<template>
	<view class="message_attachment">
		<uni-section class="mb-10" title="附件" type="line">
		</uni-section>
		<uni-row :gutter="0">
			<uni-col v-for="(attachment, index) in attachments" :key="index" :xs="{span: 24}" :sm="6">
				<view class="attachment">
					<text @click="seeAttachment(attachment.path)">{{ attachment.fileName || '空' }}</text>
				</view>
			</uni-col>
		</uni-row>
	</view>
</template>

<script setup lang="ts">
	import $tab from '@/plugins/tab';
	import { onMounted, ref } from 'vue';


	onMounted(() => {
		startAttachmentCheck();
	})
	const intervalId = ref(null); // 定时器ID

	// TODO: 根据接口返回的数据动态生成process表单
	// const props = defineProps(['attachments'])
	const props = defineProps({
		attachments: {
			type: Array,
			required: true,
			default: []
		}
	})
	//检查附件列表是否有数据
	function startAttachmentCheck() {
		intervalId.value = setInterval(() => {
			console.log(111);
			if (props.attachments) {
				console.log('props', props.attachments);
				clearInterval(intervalId.value); // 清除定时器    
			}
		}, 100); // 每0.1秒检查一次
	}

	//预览文件
	function seeAttachment(path) {
		// console.log('path',path);
		$tab.navigateTo('/pages/message/detail/URLView?type=doc&url=' + encodeURIComponent(path));
	}
</script>

<style lang="scss">
	.attachment {
		color: blue;
		margin-left: 5px;
	}
</style>