Flutter CallBack传值小例子

大家都知道回调方法在父子Widget之间传值是非常有用的,特别是用于子Widget向父Widget传值,接下来我们就看下具体做法.

1.先定义一个子Widget,为了方便我们暂时用StatelessWidget

class CallBackTestWidget extends StatelessWidget{
  CallBackTestWidget({
    Key key,
  }):super(key:key);
...此处省略多余代码
}

2.定义一个回调函数类型

typedef clickCallback = void Function(String value);

3.将回调函数透出子Widget

  CallBackTestWidget({
    Key key,
    this. onClick,
  }):super(key:key);
  final clickCallback onClick;

4.子Widget中按钮的点击函数

  void onClicked(){
    this. onClick('传的参数');
  }

5.子Widget按钮点击调用函数

@override
  Widget build(BuildContext context) {
    // TODO: implement build
    return InkWell(
      child: Container(
        width: 60,
        child:Text(
             '测试',
             style: TextStyle(
                fontSize: 16,
                color: Color(0xff333333)
             ),
           ) ,
      ),
      onTap: onClicked,
    );
  }

6.父组件中调用

CallBackTestWidget(
     onPressed:(value){
         print("子Widget回调函数传值:$value");
     }
)

至此子组件透给父组件的回调函数已经构造完成

Flutter CallBack传值小例子

推荐阅读更多精彩内容