鸿蒙开发 组件之间的传值

1.@Prop：父组件传递给子组件，单向传递，子组件改变值，父组件UI不更新。

  引入子组件  并赋值，子组件用@Prop 接收

  import headerView from '../../common/bean/BaseNavHeaderView'   

headerView({titlestr:'添加地址',isback:true,isleftimage:'',isright:true,rightcontentstr:'保存',rightimage:'',fromehere:'添加地址',startCalcute:this.startCalcuteMoney.bind(this)
}).width('100%').height('44').backgroundColor('#FFD615').zIndex(888)

@Component
export default  struct BaseNavHeaderView {@Prop titlestr:string;isback:Boolean;isleftimage:string;isright:Boolean;rightcontentstr:string;rightimage:string;fromehere:string;startCalcute:() => void = () =>{}

2.@Link 双向传递，子组件改变父组件UI更新，注意：不能修饰带@Entry 类型的pages.

   父试图定义变量，传递给子组件child时要用$

@State dianjicounts:number = 0

 child({dianjicounts:$dianjicounts})

子组件接收

 @Component export default struct child {

      @Link dianjicounts:number

    调用用this.dianjicounts

}

3.@Provide/@Consume 不需要传递参数，UI会更新

 父组件定义并调用子组件

@Provide dianjicounts: number = 0 

child()

子组件接收

@Component export default struct child {

     @Consume dianjicounts:number

     调用用this.dianjicounts

}

4.方法传递

  父组件定义方法

startCalcuteMoney():void{

     console.log('保存一下')

}

传给子组件，要用bind方法绑定一下

headerView({

   startCalcute:this.startCalcuteMoney.bind(this)

}) 

子组件接收

@Component export default struct BaseNavHeaderView {

        @Prop startCalcute:() => void = () =>{}

子组件调用

    this.startCalcute()

}