wlred/pages/applic/love.vue

<template>
	<view class="center">
		<view v-for="(item,index) in list" :key="index" class="box" @click="nav(item.src)">
			<image :src="item.image"></image>
			<view class="font">{{ item.name }}</view>
		</view>
		
	</view>
	
</template>

<script>
export default {
	data() {
		return {
			list: [
				{
					image: '/static/images/money.jpg',
					name: '爱心捐款',
					src: '/pages/applic/contribution'
				},
				{
					image: '/static/images/goods.jpg',
					name: '其他捐款捐物渠道',
					src: '/pages/applic/other'
				}
			]
		}
	},
	methods: {
		nav(url) {
			uni.navigateTo({
				url:url, 
			})
		}
	}
}
</script>

<style lang="scss">
	page,.center{
		height: 100%;
		background: #F2F2F2;
	}
	.box {
		width: 90% ;
		height: 416rpx;
		margin: 26rpx auto;
		background: #FEFEFE;
		border-radius: 20rpx;
		box-shadow: 0 0 10rpx rgba($color: #999, $alpha: 0.9);
		image {
			border-radius: 20rpx 20rpx 0 0;
			width: 100%;
			height: 300rpx;
		}
		.font {
			margin-top: 30rpx;
			font-size: 34rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #0E0E0E;
			padding-left: 28rpx;
		}
	}
</style>