universal-wechat-uniapp-241007/components/list/dynamic/dynamicItem.vue

<template>
	<view class="works" @click="$emit('click')">

		<userHeadItem :item="item" />

		<daynamicInfo :item="item" />
		
		<dynamicToShop
		:shop="item.shop"
		/>

		<statisticalDataInfo 
		:item="item"
		type="0"
		/>
		
		<!-- 评论列表组件 -->
		<commentList 
		:comments="item.comments"
		:hasMoreComments="item.isComment > item.comments.length"
		@goToDetail="handleGoToDetail"
		v-if="item.comments && item.comments.length > 0"
		/>
	</view>
</template>

<script>
	import userHeadItem from '@/components/list/dynamic/userHeadItem.vue'
	import daynamicInfo from '@/components/list/dynamic/daynamicInfo.vue'
	import dynamicToShop from '@/components/list/dynamic/dynamicToShop.vue'
	import statisticalDataInfo from '@/components/list/statisticalDataInfo.vue'
	import commentList from '@/components/list/dynamic/commentList.vue'
	import visibilityObserver from '@/mixins/visibilityObserver.js'
	
	export default {
		mixins: [visibilityObserver],
		components: {
			userHeadItem,
			daynamicInfo,
			statisticalDataInfo,
			dynamicToShop,
			commentList,
		},
		props: {
			item: {},
		},
		methods: {
			handleGoToDetail() {
				// 触发父组件事件，传递当前item数据
				this.$emit('goToDetail', this.item)
			}
		},
	}
</script>

<style scoped lang="scss">
	.works {
		margin: 40rpx 20rpx;
		background-color: #fff;
		padding: 40rpx;
		border-radius: 20rpx;
		box-shadow: 0 0 6rpx 6rpx #00000011;
	}
</style>