AI 助理
备案控制台
开发者社区 云计算 文章 正文

uniapp 九宫格抽奖功能效果demo（整理）

2023-07-11 514
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： uniapp 九宫格抽奖功能效果demo（整理） 
<template>
  <view class="bg">
    <view class="container">
      <view class="limitbean">剩余抽奖次数 {{free}}</view>
      <view class="frame_view">
        <view class="frame_row" style="margin-top: 48rpx;">
          <view class="frame_item" :class="'item' + color[0]">
            <image :src="award[0].img"></image>
            <text>{{ award[0].name }}</text>
          </view>
          <view class="frame_item" :class="'item' + color[1]">
            <image :src="award[1].img"></image>
            <text>{{ award[1].name }}</text>
          </view>
          <view class="frame_item" :class="'item' + color[2]">
            <image :src="award[2].img"></image>
            <text>{{ award[2].name }}</text>
          </view>
        </view>
        <view class="frame_row">
          <view class="frame_item" :class="'item' + color[7]">
            <image :src="award[7].img"></image>
            <text>{{ award[7].name }}</text>
          </view>
          <!-- 抽奖 -->
          <view style="text-align: center;color: #fff;">
            <view style="font-size: 36rpx;">{{free}}次</view>
            <view style="font-size: 28rpx;">免费次数</view>
          </view>
          <view class="frame_item" :class="'item' + color[3]">
            <image :src="award[3].img"></image>
            <text>{{ award[3].name }}</text>
          </view>
        </view>
        <view class="frame_row">
          <view class="frame_item" :class="'item' + color[6]">
            <image :src="award[6].img"></image>
            <text>{{ award[6].name }}</text>
          </view>
          <view class="frame_item" :class="'item' + color[5]">
            <image :src="award[5].img"></image>
            <text>{{ award[5].name }}</text>
          </view>
          <view class="frame_item" :class="'item' + color[4]">
            <image :src="award[4].img"></image>
            <text>{{ award[4].name }}</text>
          </view>
        </view>
      </view>
      <view class="luckbtulist">
        <view class="luckone" @click="clickLuck">
          <p style="margin-top: 30upx;">免费抽奖</p>
        </view>
        <view class="luckfive" @click="clickLuckFive">
          <p style="margin-top: 30upx;">分享加一次</p>
        </view>
      </view>
      <view class="lucktips">
        <view class="lucktab">
          <view class="luckrule" @click="toggleTabs(0)" :style="styleObject">活动规则</view>
          <view class="record" @click="toggleTabs(1)" :style="styleObject1">获奖记录</view>
        </view>
        <view v-show="nowIndex==0" class="ruleinof">
          <view class="ruleconten">我是活动规则</view>
        </view>
        <view class="ruleinof" v-if="isif" v-show="nowIndex==1">
          <view style="width: 100%;height: 496rpx;  margin-top: 40rpx;overflow-y:auto;">
            <view class="recordlist">
              <view>时间:{{cjtime}}</view>
              <view>{{prize}}</view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <!-- 弹出窗口 -->
    <view :class="{'share-box': shareState}" @click="handleHiddenShare">
      <view v-if="lucktype==0" class="nopop" :class="{'share-show': shareState}">
        <view style="margin-top: 60rpx;margin-left: 180rpx;margin-bottom: 30rpx;">
          <image src="https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_36_52_5.png" mode=""
            style="width: 124rpx;height: 144rpx;"></image>
        </view>
        <view class="poptitle">今日已经没有抽奖机会了</view>
        <view class="popbtn">确定</view>
      </view>
      <!-- 单抽 -->
      <view v-else-if="lucktype==1" class="onepop" :class="{'share-show': shareState}">
        <view class="popconten">
          <image :src="prizeimg" mode="" style="width: 190rpx;height: 190rpx;"></image>
          <view style="margin-top: 20rpx;color: #4A4A4A;font-size: 28rpx;">{{prize}}</view>
        </view>
        <view class="popbtn" style="margin-top: -90rpx;">确定</view>
      </view>
    </view>
  </view>
</template>
<script>
  //计数器
  var interval = null;
  //值越大旋转时间越长  即旋转速度
  var intime = 100;
  export default {
    data() {
      return {
        //抽奖记录的显示
        isif: false,
        cjtime: "",
        // nowIndex为0的时候显示抽奖规则，nowIndex为1的时候显示抽奖记录
        nowIndex: 0,
        // 九宫格初始化的位置
        color: [0, 0, 0, 0, 0, 0, 0, 0],
        //chance中奖率   
        award: [{
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_34_47_2.png',
            name: '谢谢参与',
            chance: 0,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_35_36_10.png',
            name: '洗衣机',
            chance: 100,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_35_36_10.png',
            name: '谢谢参与',
            chance: 0,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_34_47_2.png',
            name: '笔记本',
            chance: 0,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_35_36_10.png',
            name: '谢谢参与',
            chance: 0,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_34_47_2.png',
            name: '电脑',
            chance: 0,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_35_36_10.png',
            name: '谢谢参与',
            chance: 0,
          },
          {
            img: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_35_36_10.png',
            name: '冰箱',
            chance: 0,
          }
        ], //接收数组
        Luck: true, //防置重复点击
        lucktype: 2, //判断奖品类型
        luckPosition: 0, //停止位置
        prize: '', //奖品，
        prizeimg: 'https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_35_36_10.png', //奖品图片
        // 弹窗按钮
        shareState: false,
        // tab切换
        styleObject: {
          'border-bottom': '3px solid #A24A1E',
        },
        styleObject1: '',
        //免费抽奖次数
        free: 3,
        // 判断类型
        payout: 0
      };
    },
    created() {
      //获取当前时间戳
      var date = new Date().getTime();
      // 把当前的时间戳转换成yyy-MM-dd HH:mm:ss
      function timestampToTime(timestamp) {
        var date = new Date(timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        var Y = date.getFullYear() + '-';
        var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
        var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
        var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
        var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
        return Y + M + D + h + m + s;
      }
      var hour = timestampToTime(date)
      console.log(hour);
      this.cjtime = hour;
    },
    methods: {
      // 记录切换nowIndex(0)的时候显示活动规则nowIndex(1)的时候显示奖品记录
      toggleTabs(index) {
        this.nowIndex = index;
        if (index == 1) {
          this.styleObject1 = {
            'border-bottom': '3px solid #A24A1E',
          }
          this.styleObject = {}
        } else {
          this.styleObject = {
            'border-bottom': '3px solid #A24A1E',
          }
          this.styleObject1 = {}
        }
      },
      // 关闭中奖弹窗
      handleHiddenShare() {
        this.shareState = false;
      },
      // 点击抽奖
      clickLuck() {
        //抽奖记录的显示
        setTimeout(() => {
          this.isif = true;
        }, 8000);
        if (this.Luck == false) { //防止过度点击
          return;
        }
        this.Luck = false;
        // }
        //判断免费次数    
        if (this.free == 0) {
          this.shareState = true
          this.lucktype = 0
          this.Luck = true;
          return;
        }
        var arr = [];
        //根据概率循环位置
        for (var i = 0; i < this.award.length; i++) {
          for (var k = 0; k < this.award[i].chance; k++) {
            arr.push(i);
          }
        }
        console.log(arr, "位置");
        //随机打乱数组
        for (let i = 0, len = arr.length; i < len; i++) {
          let index = parseInt(Math.random() * (len - 1));
          let tempValue = arr[i];
          arr[i] = arr[index];
          arr[index] = tempValue;
        }
        //从数组中随机抽取一个位置
        var a = Math.ceil(Math.random() * 10);
        if (this.free != 0) {
          this.free = this.free - 1 //抽奖次数减1
        }
        if (this.free == 0) {
          this.payout = 1
        }
        this.luckPosition = arr[a]; //位置
        this.prize = this.award[arr[a]].name //奖品名字
        this.prizeimg = this.award[arr[a]].img //奖品图片
        // 设置this
        var e = this;
        //清空计时器
        clearInterval(interval);
        var index = 0;
        //循环设置每一项的背景图
        interval = setInterval(function() {
          var c = [0, 0, 0, 0, 0, 0, 0, 0];
          if (index > 7) {
            index = 0;
          }
          c[index] = 1;
          e.color = c;
          index++;
        }, intime);
        e.stop(e.luckPosition);
      },
      // 停止
      stop(which) {
        var e = this;
        //清空计数器
        clearInterval(interval);
        //初始化当前位置
        var current = -1;
        var color = e.color;
        for (var i = 0; i < color.length; i++) {
          if (color[i] == 1) {
            current = i;
          }
        }
        //下标从1开始
        var index = current + 1;
        e.stopLuck(which, index, intime, 10);
      },
      /**
       * which:中奖位置
       * index:当前位置
       * time：时间标记
       * splittime：每次增加的时间 值越大减速越快
       */
      stopLuck(which, index, time, splittime) {
        var e = this;
        //值越大出现中奖结果后减速时间越长
        var color = e.color;
        setTimeout(function() {
          //重置前一个位置
          var c = [0, 0, 0, 0, 0, 0, 0, 0];
          if (index > 7) {
            index = 0;
          }
          //当前位置为选中状态
          c[index] = 1;
          e.color = c;
          //如果旋转时间过短或者当前位置不等于中奖位置则递归执行
          //直到旋转至中奖位置
          if (time < 400 || index != which) {
            //越来越慢
            splittime++;
            time += splittime;
            //当前位置+1
            index++;
            e.stopLuck(which, index, time, splittime);
          } else {
            //中奖
            e.shareState = true
            e.Luck = true;
            e.lucktype = 1
            if (e.payout == 1) {
              e.limitnum = e.limitnum - 3
            }
          }
        }, time);
      },
      // 分享加一次
      clickLuckFive() {
        this.free = this.free + 1;
      }
    },
  };
</script>
<style>
  .bg {
    width: 100%;
    min-height: 2200upx;
    background-color: #136eb7;
    background-size: 100% 100%;
  }
  .container {
    overflow: hidden;
  }
  .limitbean {
    width: 100%;
    color: #fff;
    text-align: center;
    margin-top: 80rpx;
    font-size: 30rpx;
    margin-bottom: 24rpx;
  }
  .frame_view {
    width: 648rpx;
    height: 688rpx;
    margin: 0 auto;
    border-radius: 30rpx;
    background: url("https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_37_50_4.png") no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
  }
  .frame_row {
    width: 520rpx;
    height: 168rpx;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: 64rpx;
    margin-bottom: 20rpx;
  }
  .frame_item {
    width: 168rpx;
    height: 168rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    font-size: 20px;
    /* box-sizing:border-box; */
    background: #FFFFFF;
    /*  border-radius: 17px; */
    /*  box-shadow: 0px 6px 0px 0px rgba(236,231,228,1); */
    background: url("https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_41_5_0.png") no-repeat;
    background-size: 100% 100%;
  }
  .frame_item image {
    width: 80rpx;
    height: 80rpx;
    display: block;
  }
  .frame_item text {
    font-size: 26rpx;
    display: block;
    width: 100%;
    text-align: center;
    color: #818181;
    margin-top: -40rpx;
  }
  .item1 {
    background: url("https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_42_16_6.png") no-repeat;
    background-size: 100% 100%;
    // box-shadow: 0px 10px 20px 0px rgba(170,56,0,1), 0px 0px 20px 0px rgba(196,58,215,1), 0px 4px 0px 0px rgba(255,255,255,0.29);
  }
  .luckbtulist {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
  }
  .luckone {
    width: 310upx;
    height: 100upx;
    background: linear-gradient(360deg, #E4392C 0%, #F6A261 100%);
    box-shadow: 0px 10px 20px 0px rgba(153, 0, 0, 0.81), 0px 5px 0px 0px rgba(195, 48, 7, 1), 0px 4px 0px 0px rgba(255, 255, 255, 0.23);
    border-radius: 50upx;
    margin-right: 28rpx;
    text-align: center;
  }
  .luckfive {
    width: 310upx;
    height: 100upx;
    background: linear-gradient(180deg, #FFC3AC 0%, #D43EDC 100%);
    box-shadow: 0px 10px 20px 0px rgba(170, 56, 0, 1), 0px 5px 0px 0px rgba(196, 58, 215, 1), 0px 4px 0px 0px rgba(255, 255, 255, 0.29);
    border-radius: 50px;
    text-align: center;
  }
  .lucktips {
    width: 686rpx;
    height: 800rpx;
    background: #0d62ad;
    border-radius: 20rpx;
    margin: 0 auto;
    margin-top: 70rpx;
  }
  .lucktab {
    width: 580rpx;
    height: 104rpx;
    border-bottom: 1rpx solid #e3672a;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 28rpx;
    color: #e3672a;
    font-weight: 600;
  }
  .lucktab view {
    height: 100%;
    line-height: 104rpx;
  }
  .action {
    border-bottom: 3px solid #e3672a;
  }
  .ruleinof {
    width: 584rpx;
    height: 496rpx;
    margin: 0 auto;
    font-size: 28rpx;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #D97645;
  }
  .ruleinof .ruleconten {
    margin-top: 40rpx;
    line-height: 40rpx;
  }
  .recordlist {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20rpx;
  }
  .share-box {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0rpx;
    left: 0rpx;
    bottom: 0rpx;
    right: 0rpx;
    background-color: rgba(0, 0, 0, 0.4);
    transition: .3s;
    z-index: 999;
  }
  .nopop {
    display: none;
    width: 470rpx;
    height: 455rpx;
    background: #FFFFFF;
    border-radius: 30px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -228rpx;
    /* 高度的一半 */
    margin-left: -235rpx;
    /* 宽度的一半 */
  }
  .share-show {
    display: block !important;
  }
  .poptitle {
    font-size: 28rpx;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #4A4A4A;
    text-align: center;
  }
  .popbtn {
    width: 310upx;
    height: 100upx;
    background: linear-gradient(360deg, #E4392C 0%, #F6A261 100%);
    box-shadow: 0px 10px 10px 0px rgba(153, 0, 0, 0.81), 0px 5px 0px 0px rgba(195, 48, 7, 1), 0px 4px 0px 0px rgba(255, 255, 255, 0.23);
    border-radius: 50upx;
    margin-right: 28rpx;
    text-align: center;
    line-height: 100upx;
    font-size: 32upx;
    color: #fff;
    margin: 0 auto;
    margin-top: 36upx;
  }
  .onepop {
    display: none;
    width: 696rpx;
    height: 872rpx;
    background: url("https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_41_31_5.png") no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -438rpx;
    /* 高度的一半 */
    margin-left: -350rpx;
    /* 宽度的一半 */
    overflow: hidden;
  }
  .popconten {
    width: 470rpx;
    height: 472rpx;
    background: url("https://cdnapp.jixianzhilu.cn/circle_image/2021_06_8_14_39_28_5.png") no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    margin-top: 340rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .popcontenlist {
    width: 470rpx;
    height: 300rpx;
    margin: 0 auto;
    margin-top: 370rpx;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
  .poplucklist {
    width: 88rpx;
    height: 180rpx;
    margin-left: 56rpx;
  }
</style>
关键词：
uniapp功能
uniapp九宫格抽奖
uniapp功能demo
小马大咖
目录
相关文章
李木子2024
|
3月前
|
移动开发 JavaScript 前端开发
【Uniapp 专栏】Uniapp 与 Flutter 的功能特点对比
【5月更文挑战第15天】Uniapp 和 Flutter 是跨平台开发的热门框架。Uniapp 以其强大的跨平台兼容性和基于 Vue.js 的易学性著称，适合快速开发适用于 iOS、Android 和 H5 的应用。其丰富的组件生态简化了功能集成。然而，在复杂场景下，性能可能不及原生。Flutter 则以其全新渲染引擎实现流畅界面和高度自定义，性能接近原生，但学习成本较高，需处理特定平台适配。适用于高要求的项目。两者各有优势，选择应考虑项目需求、技术储备和开发周期。
李木子2024
531 1
【Uniapp 专栏】Uniapp 与 Flutter 的功能特点对比
广州爱奇迪
|
18天前
|
开发框架 移动开发 前端开发
基于SqlSugar的开发框架循序渐进介绍（19）-- 基于UniApp+Vue的移动前端的功能介绍
基于SqlSugar的开发框架循序渐进介绍（19）-- 基于UniApp+Vue的移动前端的功能介绍
广州爱奇迪
32 2
八音盒coding
|
1月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现(源码+lw+部署文档+讲解等)
八音盒coding
39 7
wishCoding
|
1月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的多功能智能手机阅读APP附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的多功能智能手机阅读APP附带文章源码部署视频讲解等
wishCoding
39 1
小蜗牛耶
|
2月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现
小蜗牛耶
54 12
蓝易云
|
1月前
|
前端开发 JavaScript 索引
uniapp的u-album组件自定义删除功能
这样，你就可以在u-album组件中实现自定义的删除功能了。需要注意的是，这个删除操作只是在前端删除了图片项，并没有在后端删除对应的图片文件，如果你需要在后端也删除对应的图片文件，你还需要在删除操作后发送一个请求到后端，让后端删除对应的图片文件。
蓝易云
38 0
李木子2024
|
3月前
|
存储 开发框架 自然语言处理
【Uniapp 专栏】Uniapp 的多语言支持功能详解
【5月更文挑战第14天】Uniapp是一款跨平台开发框架，提供强大多语言支持，助力开发者轻松构建支持多种语言的应用，提升用户体验和市场拓展。其特点包括灵活的语言管理、跨平台一致性。通过语言文件存储内容，切换机制让用户自由切换。注重翻译准确性和文化适应性，集成到页面和组件中，同时关注性能优化。面对翻译不一致和更新及时性等问题，Uniapp将持续发展和完善，为全球化应用开发提供强有力支持。
李木子2024
132 3
【Uniapp 专栏】Uniapp 的多语言支持功能详解
李木子2024
|
3月前
|
存储 开发框架 安全
【Uniapp 专栏】探索 Uniapp 的本地存储功能特点
【5月更文挑战第14天】Uniapp的本地存储功能是其跨平台开发的强大优势，提供数据持久化的存储、读取，支持多种数据类型。其特点是简单易用、跨平台一致且有一定安全性。通过键值对存储和容量管理，适应不同应用场景，如用户登录信息存储和应用配置保存。同时，注意性能优化、数据清理和安全保护。与其他框架比较，Uniapp有独特优势，并将持续发展以满足复杂需求。开发者应根据业务需求设计存储策略，确保数据安全高效使用。
李木子2024
127 2
【Uniapp 专栏】探索 Uniapp 的本地存储功能特点
球球不吃虾
|
3月前
|
移动开发 前端开发 JavaScript
uniapp中IO模块（管理本地文件系统）的常用功能封装
uniapp中IO模块（管理本地文件系统）的常用功能封装
球球不吃虾
251 1
wishCoding
|
2月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的多功能智能手机阅读APP附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的多功能智能手机阅读APP附带文章和源代码部署视频讲解等
wishCoding
29 0

热门文章

最新文章

  • 1
    uniapp配置去掉友盟无法打包，提示配置错误如何解决
  • 2
    uniapp打包成H5部署到服务器教程
  • 3
    UniApp调用SDK原生接口
  • 4
    HBuilderX运行uniapp到微信开发者工具常见报错
  • 5
    解决前端报错 Error: Cannot find module ‘xxx‘（包含 uniapp）
  • 6
    前端（五）——从 Vue.js 到 UniApp：开启一次全新的跨平台开发之旅
  • 7
    uniapp跨域解决
  • 8
    （简单详细）uniapp实现自定义海报内容并生成海报二维码图片（可拖拽，可调节大小）
  • 9
    uniapp配置element-ui代码块
  • 10
    【笔记01】在 uniapp 安装 uview-ui
  • 1
    UniApp状态管理：从深入理解到灵活运用
    86
  • 2
    UniApp 中的路由魔法：玩转页面导航与跳转
    861
  • 3
    从零开始：UniApp 项目搭建指南
    104
  • 4
    uniapp框架——vue3+uniFilePicker+fastapi实现文件上传(搭建ai项目第二步)
    198
  • 5
    uniapp框架——初始化vue3项目(搭建ai项目第一步)
    89
  • 6
    云效产品使用报错问题之流水线发布uniapp的应用失败如何解决
    642
  • 7
    基于SpringBoot+Vue+uniapp微信小程序的微信课堂助手小程序的详细设计和实现
    93
  • 8
    基于SpringBoot+Vue+uniapp微信小程序的电子商城购物平台的详细设计和实现
    87
  • 9
    基于SpringBoot+Vue+uniapp微信小程序的英语学习交流平台的详细设计和实现
    56
  • 10
    基于SpringBoot+Vue+uniapp微信小程序的微信阅读网站小程序的详细设计和实现
    67

    • 相关课程

    更多
  • 相册服务中的故事生成算法介绍

    • 相关电子书

    更多
  • QQ移送页面框架优化实践
  • QQ移动页面框架优化实践
  • 支付宝小程序教程

    • 相关实验场景

    更多
  • 2048小游戏
  • 搭建微信小程序
  • 收银台的场景化界面实践
  • 小试牛刀，一键部署电商商城
  • 1分钟部署经典小游戏
    • 下一篇
    通义千问API入门教程