<template>
	<view class="bannerlist">
		<view class="li" v-for="value in valuearray">
			<image :src="value[1]"></image>
			<text>{{value[0]}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		
		data() {
			let valuearray = ["开门", "我的房屋", "我的车位", "物业缴费", "扫码取件", "社区公告", "社区电话", "投诉建议"]
				.map((value, index) => [value,
					`../../static/${["open-door.png","house.png","feedback-1.png","property-bill.png","qr-pick.png","note.png","property-tel.png","feedback.png"][index]}`
				])
			return {
				valuearray
			}
		},
		methods: {

		},
		mounted() {
			console.log(this.valuearray)
		}
	}
</script>

<style>
	* {
		padding: 0;
		margin: 0;
	}

	.bannerlist {
		width: 100%;
		height: 20vh;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		justify-items: center;
	}

	.li {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.li image {
		width: 40px;
		height: 40px;
	}
</style>
