• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2025 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 *
15*/
16
17// src/main/ets/pages/4-Event.ets
18
19@ComponentV2
20struct TaskItem {
21  @Param taskName: string = '';
22  @Param @Once isFinish: boolean = false;
23  @Event deleteTask: () => void = () => {};
24
25  build() {
26    Row() {
27      Image(this.isFinish ? $r('app.media.finished') : $r('app.media.unfinished'))
28        .width(28)
29        .height(28)
30      Text(this.taskName)
31        .decoration({ type: this.isFinish ? TextDecorationType.LineThrough : TextDecorationType.None })
32      Button($r('app.string.Delete_task'))
33        .onClick(() => this.deleteTask())
34    }
35    .onClick(() => this.isFinish = !this.isFinish)
36  }
37}
38
39@Entry
40@ComponentV2
41struct TodoList {
42  @Local tasks: string[] = ['task1','task2','task3'];
43  @Local newTaskName: string = '';
44  build() {
45    Column() {
46      Text($r('app.string.TodoList_title'))
47        .fontSize(40)
48        .margin({ bottom: 10 })
49      ForEach(this.tasks, (task: string) => {
50        TaskItem({
51          taskName: task,
52          isFinish: false,
53          deleteTask: () => this.tasks.splice(this.tasks.indexOf(task), 1)
54        })
55      })
56      Row() {
57        TextInput({ placeholder: $r('app.string.Add_new_task'), text: this.newTaskName })
58          .onChange((value) => this.newTaskName = value)
59          .width('70%')
60        Button('+')
61          .onClick(() => {
62            this.tasks.push(this.newTaskName);
63            this.newTaskName = '';
64          })
65      }
66    }
67  }
68}