dreamland/pages/dream/view/picGrid.vue

<template name="picGrid">
	<view class="cover">
		<block v-for="(v, k) in item.text">
			<image :class="['abs-tag', position[v.text-1]]" v-if="v.pic" :src="v.pic" mode="widthFix"></image>
		</block>
	</view>
</template>

<script>
export default {
	name: "picGrid",
	props: {
		config : {
			type : Object,
			value : null
		},
		item : {
			type    : Object,
			value	: null
		},
	},
	data() {
		return {
			position: ["tl","tr","bl","br"],
		};
	},
	methods:{
		
	},
}
</script>

<style>
.abs-tag {
  position: fixed;
  color: #fff;
  display: flex;
  flex-direction: column;
}
.abs-tag view{
  line-height: 1em;
  overflow: hidden;
}
.abs-tag text {
  background-color: #000;
  margin-bottom: 10rpx;
  font-size: 28rpx;
  line-height: 1;
  padding: 0 2rpx;
}

.abs-tag.tl {

}

.abs-tag.tr {
  right: 0rpx;
}

.abs-tag.bl {
  width: 50%;
  height:50%;
  bottom: 125rpx;
  left: 30rpx;
}

.abs-tag.br {
  width: 50%;
  height:50%;
  bottom: 125rpx;
  right: 30rpx;
  text-align: right;
}
</style>