food_wechat/components/mainBut/mainBut.vue

<template>
	<navigator :url="url">
		<view class="flex column boxshadow rad32 but mac ofh" :style="{background:bg}">
			<view class="imgBox">
				<u--image :src="imgSrc" width="188rpx" height="188rpx"></u--image>
			</view>
			<view class="tc w100 fb butBt fci fz44 l-h-12">{{butBt}}</view>
			<view class="tc w100 butSt fci fz32">{{butSt}}</view>
		</view>
	</navigator>
</template>

<script>
	export default {
		name: "mainBut",
		data() {
			return {

			};
		},
		props: {
			url:{
				type:String,
				required: true,
			},
			bg: {
				type: String,
				default: '',
				required: true,
				deep: true
			},
			imgSrc: {
				type: String,
				default: '',
				required: true,
				deep: true
			},
			butBt: {
				type: String,
				default: '',
				required: true,
				deep: true
			},
			butSt: {
				type: String,
				default: '',
				required: true,
				deep: true
			},
		},
	}
</script>

<style lang="scss">
	.but {
		width: 339rpx;
		height: 339rpx;
	}

	.imgBox {
		width: 188rpx;
		height: 188rpx;
		margin-top: 36rpx;
	}

	.butBt {
		height: 48rpx;
	}

	.butSt {
		height: 40rpx;
	}
</style>