鸿蒙HarmonyOS小项目开发---禅定空间（终篇）_手机禅定模式程序编写方法-CSDN博客

 Button('确定')
            .onClick(() => {
              router.pushUrl({
                url: 'pages/Index',
                params: { name: this.name, time: this.time }
              })
            })

这里通过params传递了this.name、this.time，也就是讲输入的活动名称和活动时间传递给Index主页面。并在主界面中进行获取

@State params:any = router.getParams()

由于router.getParams()获取的为Object对象，所以要通过any型进行获取。

any 是一种类型，表示可以赋予任何值的类型。使用 any 类型可以绕过TypeScript的类型检查，这在某些情况下可以提供便利，但过度使用 any 会失去TypeScript提供的类型安全优势。

由于主界面中是通过数组进行遍历输出数据，所以需要将新增信息添加到数组中，但是如果在新增界面进行向数组增加数据，在跳转后就无法进行增加了，所以需要和遍历打印数组一起的主界面进行新增数据，还需要通过介质进行触发新增数组数据，所以新建“刷新”当做介质新增数据，并将传递的数据应用this.params.name|this.params.time。

 Text('刷新')
            .fontSize(20)
            .margin({ top: 10 })
            .fontColor('#fff')
            .onClick(() => {
              // 点击刷新时，向task数组添加新任务
              this.task.push(new TaskInfo(this.params.name, this.params.time));
            })

List()遍历统一类型时也是同样的原理，跳转到时间管理界面，并将时间进行传递。

.onClick(() => {
                        // 点击图标时，跳转到任务详情页面
                        router.pushUrl({
                          url: 'pages/ShowPage',
                          params: { time: tasks.time }
                        },
                          router.RouterMode.Single,
                          err => {
                            if (err) {
                              console.log(`路由失败，errCode: ${err.code} errMsg: ${err.message}`)
                            }
                          })
                      })

时间管理界面及功能

布局及倒计时功能

当在主界面进行点击小闹钟图标后，就会跳转到时间管理主要是通过TextTimer组件来实现倒计时效果，TextTimer组件拥有正计时和倒计时两个功能，在这里选择倒计时模式，设置倒计时参数、格式和控制器，通过控制器控制时间的开始、暂停、结束。

需要首先创建TextTimerController实例，用于控制文本倒计时 textTimerController: TextTimerController = new TextTimerController()。
TextTimer: 这可能是一个自定义的定时器组件，用于显示倒计时。
isCountDown: true: 表示这是一个倒计时模式。
count: 设置倒计时的总时间，以毫秒为单位的时间值，60000毫秒为1秒。
controller: this.textTimerController: 传入一个控制器对象，可能用于控制定时器的开始、停止等行为。
.format(): 设置倒计时的显示格式。
启动倒计时 this.textTimerController.start()；
暂停倒计时 this.textTimerController.pause()
重置倒计时 this.textTimerController.reset()

需要提前对倒计时显示格式进行设计

@State format: string = 'mm:ss'

如下代码：

 Text('禅定空间')
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
        .margin({top: 20, right: 150})
      // 创建TextTimer组件，设置倒计时参数、格式和控制器
      TextTimer({ isCountDown: true, count: this.params.time * 60000, controller: this.textTimerController })
        .format(this.format) // 设置倒计时格式
        .fontColor(Color.Black) // 设置字体颜色
        .fontSize(100) // 设置字体大小
        .onTimer((utc: number, elapsed