MeetMateApp/pages/index/index.vue

<template>
	<view class="page">
		<view class="header">
			<view class="left">
				<image class="img" mode="widthFix" src="../../static/home/top_title.png"></image>
			</view>
		</view>
		<view class="topbanner">
			<view class="left">
				<image class="aibg" mode="widthFix" src="../../static/home/ai_bg.png"></image>
				<view class="title">AI匹配</view>
				<view class="desc">遇见那个TA</view>
				<view class="btn">开始匹配</view>
			</view>
			<view class="right">
				<view class="item1">
					<image class="meinv" mode="widthFix" src="../../static/home/meinv.png"></image>
					<view class="title">兴趣交友</view>
					<view class="desc">开启真挚交友</view>
				</view>
				<view class="item2">
					<image class="talk" mode="widthFix" src="../../static/home/talk.png"></image>
					<view class="title">热门动态</view>
					<view class="desc">点燃思想火花</view>
				</view>
			</view>
		</view>
		<view class="centerbanner">
			<view class="item1">
				<image class="icon" mode="widthFix" src="../../static/home/talk2.png"></image>
				<view class="title">加密群聊</view>
			</view>
			<view class="item2">
				<image class="icon" mode="widthFix" src="../../static/home/nan.png"></image>
				<view class="title">AI男友</view>
			</view>
			<view class="item3">
				<image class="icon" mode="widthFix" src="../../static/home/nv.png"></image>
				<view class="title">AI女友</view>
			</view>
		</view>
		<view class="section-title">
			热门动态
		</view>
		<view class="article_notify">
			<view class="left">
				<image class="icon" mode="widthFix" src="../../static/home/nv.png"></image>
			</view>
			<view class="right">
				<view class="title">热门动态
					<image class="icon" mode="widthFix" src="../../static/home/icon_vip.png"></image>
				</view>
				<view class="desc">点燃思想火花</view>
			</view>
		</view>
		<view class="section-title">
			精选推荐
		</view>
		<view class="list">
			<view class="item" v-for="(item,index) of 4" :key="index">
				<view class="img">
					<image class="icon" mode="widthFix" src="../../static/home/nan.png"></image>
				</view>
				<view class="tit">
					<text class="name">冷桂霞</text>
					<text class="juli">5.6km</text>
				</view>
				<view class="tag_list">
					<view class="tag">
						<image class="icon" mode="widthFix" src="../../static/home/icon_sex2.png"></image>
						<text>24</text>
					</view>
					<view class="tag2">
						<text>白领</text>
					</view>
					<view class="tag2">
						<text>摩羯座</text>
					</view>

				</view>
			</view>
		</view>


		<view class="thread2"></view>
		<view class="thread2"></view>

		<wu-app-update></wu-app-update>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				title: '',

			}
		},
		onLoad() {
			let self = this;

		},
		onShow() {
			uni.$emit('check_update');
		},
		methods: {}
	}
</script>

<style scoped lang="scss">
	@import 'index.scss';
</style>