food_wechat/components/badge/badge.vue

<template>
	<view v-if="cou!==0" class="badge bg-m fci flex mac mc rad-c" :style="{ right: offset[0] + 'rpx', top: offset[1] + 'rpx' }">
		{{cou>99?99:cou}}
	</view>
</template>

<script>
	export default {
		name: "badge",
		data() {
			return {};
		},
		computed: {
		},
		props: {
			offset: {
				type: Array,
				default () {
					return [-20, -16] // 默认值
				}
			},
			cou: {
				type: Number,
				require: true
			}
		}
	}
</script>

<style lang="scss" scoped>
	.badge {
		position: absolute;
		width: 30rpx;
		height: 30rpx;
		font-size: 20rpx;
		font-weight: normal;
	}
</style>