鸿蒙next生肖选择器来了我不允许你不会

前言导读

各位同学大家，有段时间没有跟大家见面了，因为最近一直在更新鸿蒙的那个实战课程所以就没有去更新文章实在是不好意思， 所以今天就给大家更新一期实战案例 生肖抽卡的案例 希望帮助到各位同学工作和学习

效果图

具体实现

• 数据模型

  export  interface  ImageCount {
    url: Resource
    count?: number
  
  }
  

• 准备数据

• 我们准备6张图片需要等下在我们的界面上面显示

  // 2. 基于接口, 准备数据
  @State images: ImageCount[] = [
    { url:  $r('app.media.bg_00'), count: 0 },
    { url: $r('app.media.bg_01'), count: 0 },
    { url: $r('app.media.bg_02'), count: 0 },
    { url: $r('app.media.bg_03'), count: 0 },
    { url: $r('app.media.bg_04'