HarmonyOS 鸿蒙Next TextInput空内容提示及问题四、五解答求助

发布于 1周前 作者 bupafengyu 来自 鸿蒙OS

HarmonyOS 鸿蒙Next TextInput空内容提示及问题四、五解答求助

1、简易待办事项列表应用

① 应用界面具有一个输入框(TextInput 组件),用于输入待办事项内容。

② 一个“添加”按钮(Button 组件),点击后将输入框中的待办事项添加到下方的列表中。

③ 待办事项列表使用 Column 布局纵向排列每个待办事项(每个待办事项以 Text 组件显示)。每个项目前带有序号,从 1 开始。每个项目后都有一个删除按钮。

④ 当点击某个待办事项时,该事项文字颜色变为红色,表示已选中状态,再次点击恢复原色。

⑤ 当点击某一行项目后的删除按钮时,弹出一个确认对话框,询问是否删除该项目,点击确认则从列表中删除该项。

求助


更多关于HarmonyOS 鸿蒙Next TextInput空内容提示及问题四、五解答求助的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复
import { hilog } from '[@kit](/user/kit).PerformanceAnalysisKit'
import { promptAction } from '[@kit](/user/kit).ArkUI';

[@Entry](/user/Entry)
[@ComponentV2](/user/ComponentV2)
struct Index {
[@Local](/user/Local) list: Todo[] = []
[@Local](/user/Local) todoInput: string = ''

build() {
Column() {
Row() {
TextInput({ text: $$this.todoInput })
.layoutWeight(1)
Button('添加').onClick(() => {
if (this.todoInput.length == 0) {
promptAction.showToast({
message: '请输入'
})
return
}
this.list.push(new Todo(this.todoInput))
this.todoInput = ''
}).layoutWeight(0)

}

Scroll() {
Column() {
ForEach(this.list, (item: Todo, index: number) => {
Row() {
Text((index + 1).toString())
.margin({ left: '8vp', right: '16vp' })
.fontColor(item.isSelect ? Color.Red : Color.Black)
Text(item.content)
.fontColor(item.isSelect ? Color.Red : Color.Black)
.backgroundColor(item.isSelect ? Color.Gray : Color.Pink)
.padding('16vp')
Blank()
Button('删除').onClick(() => {
promptAction.showDialog({
title: '删?', buttons: [{
text: '取消',
color: '0x000000'
},
{
text: '确定',
color: '0x000000'
}
]
}, (err, data) => {
if (data.index == 1) {
let list: Todo[] = []
this.list.forEach((it: Todo) => {
if (it != item) {
list.push(it)
}
})
this.list = list
}
})
})
}
.width('calc(100% - 8vp)')
.margin({ top: '16vp' })
.backgroundColor(item.isSelect ? Color.Gray : Color.Pink)
.onClick(() => {
item.isSelect = !item.isSelect
})
})
}
}.width('100%')
.scrollBar(BarState.Off)
}.size({ width: '100%', height: '100%' })
}
}

[@ObservedV2](/user/ObservedV2)
class Todo {
[@Trace](/user/Trace) isSelect: boolean = false
content: string

constructor(content: string = '') {
this.content = content
}
}

更多关于HarmonyOS 鸿蒙Next TextInput空内容提示及问题四、五解答求助的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


状态管理V2 和V1 的区别

HarmonyOS的分布式文件系统让我在多设备间共享文件变得更加方便。

官方推荐使用v2了

楼上代码应该是可以的

针对您提出的HarmonyOS 鸿蒙Next TextInput空内容提示及问题四、五解答的求助,以下是直接回答:

TextInput空内容提示: 在HarmonyOS中,TextInput组件支持通过placeholder属性来设置空内容时的提示信息。当TextInput内容为空时,placeholder文本会显示在输入框中,作为用户输入的引导。确保您的TextInput组件已正确设置placeholder属性,且其值非空。

问题四解答: 由于您未具体描述问题四的内容,无法直接给出答案。请确保问题描述清晰,包括出现的错误、期望的行为以及已尝试的解决步骤。

问题五解答: 同样,由于问题五未具体描述,无法直接解答。请确保在求助时提供足够的信息,以便快速定位并解决问题。

如果以上回答未能解决您的问题,或者您有其他关于HarmonyOS开发的疑问,建议直接访问HarmonyOS开发者官网,查找相关文档或示例代码。若问题依旧没法解决,请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部