<template> <s-layout class="set-wrap" title="活动中心" :bgStyle="{ color: '#FFF' }"> <view class="_bgc"> <view class="menu"> <view v-for="(v, i) in menulist" :key="i"> <view class="menu_item" @tap="sheep.$router.go(v?.path)"> <image class="menu_item_img" :src="v?.url"></image> <text class="menu_item_text">{{ v.title }}</text> </view> </view> </view> <!-- <view class="menu"> <view class="menu_item" > <image class="item_img" src="http://zda.huamar.com/admin-api/infra/file/4/get/d4b717094fa8162e981eb8c17cd4cef1f25da1327d4d214fece3375962b5e59f.png"> </image> <text class="menu_item_text">抽奖</text> </view> <view class="menu_item"> <image class="item_img" src="http://zda.huamar.com/admin-api/infra/file/4/get/d4b717094fa8162e981eb8c17cd4cef1f25da1327d4d214fece3375962b5e59f.png"> </image> <text class="menu_item_text">幸运五占一</text> </view> </view> --> </view> </s-layout> </template> <script setup> import { ref } from 'vue' import { onLoad, onReachBottom, onShow, onUnload, onHide } from '@dcloudio/uni-app'; import MineApi from '@/sheep/api/prize/index' import sheep from '@/sheep'; let menulist = ref([ { title: '抽奖', path: '/pages/user/prize', url: 'http://zda.huamar.com/admin-api/infra/file/4/get/d4b717094fa8162e981eb8c17cd4cef1f25da1327d4d214fece3375962b5e59f.png' }, { title: '幸运五选一', path: '/pages/user/alternative', url: 'http://zda.huamar.com/admin-api/infra/file/4/get/082a147eb0480692b717a010b42b0299b27a563b0c85840708b9c53247dcb52f.png' }, ]) </script> <style lang="scss" scoped> ._bgc { width: 100%; height: 100vh; } .menu { display: flex; // justify-content: space-around; display: flex; flex-direction: row; flex-wrap: wrap; align-content: center; align-items: center; .menu_item { margin: 40rpx; display: flex; flex-direction: column; align-items: center; align-content: center; .menu_item_img { width: 100rpx; height: 100rpx; } } } </style>