cbz/components/news-module/news-module.vue

<template>
	<view class="news_module vflex">
		<view class="news_title">
			{{title}}
		</view>
		<view v-if="imgs.length > 0" class="imgList hflex acenter jbetween">
			<block v-for="(item,index) in imgs" :key="index">
				<image :src="item" mode="widthFix" style="width: 230rpx"></image>
			</block>
			
		</view>
		<view v-if="video !== ''" class="imgList">
			<video :src="video" controls></video>o
		</view>
		<view class="hflex acenter bottom">
			<view class="bottom_text">{{type}}</view>
			<view class="bottom_text2">{{client}}</view>
			<view class="bottom_text2">{{comment}}评论</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"news-module",
		props: {
			title: {
				type: String,
				value: '' 
			},
			imgs: {
				type: Array,
				value: [] 
			},
			video: {
				type: String,
				value: '' 
			},
			type: {
				type: String,
				value: '' 
			},
			client: {
				type: String,
				value: '' 
			},
			comment: {
				type: Number,
				value: 0
			}
		},
		data() {
			return {
			};
		}
	}
</script>

<style lang="scss">
.news_module {
	width: 100%;
	padding-bottom: 20rpx;
	border-bottom: 1rpx solid #f3f3f3;
	
	.news_title {
		font-size: 36rpx;
		color: #333;
		line-height: 50rpx;
	}
	.imgList {
		margin: 16rpx 0;
	}
	.bottom {
		
		.bottom_text {
			font-size: 24rpx;
			color: #3261FF;
		}
		.bottom_text2 {
			color: #999999;
			font-size: 24rpx;
			margin-left: 20rpx;
		}
	}
}
</style>