mdapp/pages/estate/libPre.vue

<template>
	<view class="scoped-box">
		<view @click="linkList(item.val)" class="op" v-for="(item, i) in areaType" :key="i">{{item.key}}</view>
	</view>
</template>
<script>
export default {
	data() {
		return {
			colorArr: ['#fb7366', '#ff9a59', '#9f7df5', '#60c68b', '#4da4ee', '#e77ad4'],
			areaType: [],
		};
	},
	onLoad(params) {
		const dictObj = uni.getStorageSync('MD_dict')
		this.areaType = dictObj.area_type
	},
	onReachBottom() {},
	onPullDownRefresh() {
		// 防止频繁刷新
	},
	methods: {
		linkList (v) {
			uni.navigateTo({
				url: `/pages/estate/lib?v=${v}`
			})
		}
	}
};
</script>
<style lang="scss">
.scoped-box {
	display: flex;
	flex-wrap: wrap;
	.op {
		width: 33.33%;
		text-align: center;
		color: #fff;
		height: 120rpx;
		line-height: 120rpx;
		font-size: 34rpx;
		font-weight: bold;
		&:nth-child(6n+1) {
			background: #fb7366;
		}
		&:nth-child(6n+2) {
			background: #ff9a59;
		}
		&:nth-child(6n+3) {
			background: #e77ad4;
		}
		&:nth-child(6n+4) {
			background: #9f7df5;
		}
		&:nth-child(6n+5) {
			background: #4da4ee;
		}
		&:nth-child(6n) {
			background: #60c68b;
		}
	}
}
</style>