HarmonyOS 鸿蒙Next：子组件定义了两个输入框，如何在父组件点击登录按钮的时候获取子组件输入框的值
HarmonyOS 鸿蒙Next：子组件定义了两个输入框，如何在父组件点击登录按钮的时候获取子组件输入框的值
import {LoginEditCompoments}from ‘…/compoments/LoginEditCompoments’
@Entry
@Component
struct LoginPage {
@State message: string = ‘登录页’;
private isRead:boolean=false
build() {
Column({space:20}) {
Image($r(‘app.media.img_loginreg_logo’))
.width(100)
.borderRadius(50)
.alignSelf(ItemAlign.Start)
Text(‘欢迎使用的讯’)
.alignSelf(ItemAlign.Start)
.margin({top:31
})
.fontSize(28)
LoginEditCompoments({
hintStr:‘请输入手机号码’,
isShowRight:true,
type:InputType.Number
})
LoginEditCompoments({
resLeft:‘icon_password’,
hintStr:‘请输入密码’,
isShowRight:false,
type:InputType.Password,
})
Button(‘登录’)
.width(‘70%’)
.height(40)
.margin({
top:15
})
.onClick(()=>{
if(!this.isRead){
AlertDialog.show({
message:‘请先阅读并同意隐私政策’
})
return
}
})
Row(){
Text(‘重置密码’)
Text(‘注册’)
}
.justifyContent(FlexAlign.SpaceBetween)
.width(‘100%’)
Row(){
Checkbox()
.onChange((valie:boolean)=>{
this.isRead=valie
})
Text(){
Span(‘我已阅读并同意’)
Span(’《隐私政策》’).fontColor(’#0677da’)
}
}
}
.height(‘100%’)
.width(‘100%’)
.padding(10)
}
}关于HarmonyOS 鸿蒙Next：子组件定义了两个输入框，如何在父组件点击登录按钮的时候获取子组件输入框的值的问题，您也可以访问：https://www.itying.com/category-93-b0.html 联系官网客服。
[@Component](/user/Component)
struct LoginEditCompoments {
onTextChange?: (value: string) => void
build() {
TextInput().onChange((value: string) => {
if(this.onTextChange){
this.onTextChange(value)
}
})
}
}
@Entry
@Component
struct Page02 {
@State inputValue_1: string = “”
@State inputValue_2: string = “”
build() {
Column({ space: 10 }) {
LoginEditCompoments({
onTextChange: (value) => {
this.inputValue_1 = value
}
})
LoginEditCompoments({
onTextChange: (value) => {
this.inputValue_2 = value
}
})
Button(‘登录’).onClick(() => {
console.info(inputValue_1:${<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.inputValue_1})
console.info(inputValue_2:${<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.inputValue_2})
})
}
.height(‘100%’)
.width(‘100%’)
}
}
<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>
你好，鸿蒙开发者同僚
开发老师在上方的回答非常到位。除了回调函数方法之外，还有许多其他方式可以实现组件之间的数据传递。其中，一个较为简便且常见的做法是借助状态管理机制，具体来说，就是使用 [@State](/user/State) 和 [@Link](/user/Link) 注解来促进父子组件间的数据交流。希望这些建议能对你有所帮助。
[@Entry](/user/Entry)
[@Component](/user/Component)
struct Parent{
[@State](/user/State) userName: string = ''
[@State](/user/State) userPwd: string = ''
build(){
}
}
@Component
export struct UserInfoInput
{
@Link userName: string
@Link userPwd: string
build(){
TextInput({text: <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.userName, placeholder: <span class="hljs-string"><span class="hljs-string">'请输入账号'</span></span>})
.onClick((value)=>{
<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.userName = value;
})
TextInput({text: <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.userPwd, placeholder: <span class="hljs-string"><span class="hljs-string">'请输入密码'</span></span>})
.onClick((value)=>{
<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.userPwd = value;
})
}
}
<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>
