【开发】uniapp小程序商城首页热门产品角标功能代码

近期一个UNIAPP项目中需要将热门、特价、促销活动等产品在首页着重显示，通过网上找到的解决方案就是制作好角标PNG透明图片，程序中通过TYPEID来判断显示，功能开发完成显示效果如下：

代码如下：

<!-- 猜你喜欢 -->
		<view class="f-header m-t">
			<image src="/static/temp/h1.png"></image>
			<view class="tit-box">
				<text class="tit">猜你喜欢</text>
				<text class="tit2">Guess You Like It</text>
			</view>
			<text class="yticon icon-you"></text>
		</view>
		<view class="guess-section">
			<view v-for="(item, index) in goodsList" :key="index" class="guess-item" @click="navToDetailPage(item)">
				<view class="image-wrapper">
					<view class="triangle-wrapper" v-if="item.PROMO_TYPE>0">
						<image class="triangle-tag" :src="'/static/group-tag-'+item.PROMO_TYPE+'.png'"></image>
					</view>
					<view class="triangle-wrapper" v-if="item.PROMO_TYPE<=0">
						<image class="triangle-tag" :src="'/static/group-tag-0.png'"></image>
					</view>
					<image class="image-wrapper-pic" :src="siteUrl+item.PIC_URL" mode="aspectFill"></image>
				</view>
				<text class="title clamp">{{item.PRODUCT_NAME}}</text>
				<text class="price">￥{{item.NEED_INTEGRAL}}</text>
			</view>
		</view>