鸿蒙自定义弹窗中的变量如何传递给页面_harmonyos customdialog 数据传递(2)

67 阅读2分钟

方式一:使用组件的状态变量传递。

@CustomDialog export struct CustomDialog01 { @Link inputValue: string controller: CustomDialogController

build() { Column() { Text('Change text').fontSize(20).margin({ top: 10, bottom: 10 }) TextInput({ placeholder: '', text: this.inputValue }).height(60).width('90%') .onChange((value: string) => { this.inputValue = value }) } } }

@Entry @Component struct DialogDemo01 { @State inputValue: string = 'click me' dialogController: CustomDialogController = new CustomDialogController({ builder: CustomDialog01({ inputValue: $inputValue }) })

build() { Column() { Button(this.inputValue).fontSize(30) .onClick(() => { this.dialogController.open() }).backgroundColor(0x317aff) }.width('100%').margin({ top: 5 }).height("100%").justifyContent(FlexAlign.Center) } }

方式二:在初始化弹窗时,传递一个方法给自定义弹窗,在自定义弹窗中触发该方法,弹窗中变量作为方法的参数。

@CustomDialog export struct CustomDialog01 { private inputValue: string changeInputValue: (val: string) => void controller: CustomDialogController build() { Column() { Text('Change text').fontSize(20).margin({ top: 10, bottom: 10 }) TextInput({ placeholder: '', text: this.inputValue }).height(60).width('90%') .onChange((value: string) => { this.changeInputValue(value) }) } } } @Entry @Component struct DialogDemo01 { @State inputValue: string = 'click me' dialogController: CustomDialogController = new CustomDialogController({ builder: CustomDialog01({ inputValue: this.inputValue, changeInputValue: (val: string) => { this.inputValue = val } }) })

build() { Column() { Button(this.inputValue).fontSize(30) .onClick(() => { this.dialogController.open() }).backgroundColor(0x317aff) }.width('100%').margin({ top: 5 }).height("100%").justifyContent(FlexAlign.Center) } }

方式三:使用AppStorage或LocalStorage方式管理页面状态,实现自定义弹窗和页面之间状态的共享

let storage = LocalStorage.GetShared() @CustomDialog export struct CustomDialog01 { @LocalStorageLink('inputVal') inputValue: string = '' controller: CustomDialogController build() { Column() { Text('Change text').fontSize(20).margin({ top: 10, bottom: 10 }) TextInput({ placeholder: '', text: this.inputValue }).height(60).width('90%') .onChange((value: string) => { this.inputValue = value; }) } } }

@Entry(storage) @Component struct DialogDemo01 { @LocalStorageLink('inputVal') inputValue: string = '点击' dialogController: CustomDialogController = new CustomDialogController({ builder: CustomDialog01() })

build() { Column() {

img img

网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。

需要这份系统化的资料的朋友,可以戳这里获取

一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!