Flutter中如何从子Widget调用父Widget的函数

8

我有一个父状态组件和一个子状态组件。我想从子组件调用父组件的函数,即goToPreviousItem

父类

class Parent extends StatefulWidget {
 @override
 _ParentState createState() => _ParentState();
 }

class _ParentState extends State<Parent> {
 String item = 0;
 @override
 Widget build(BuildContext context) {
   return ChildClass();
 }


goToPreviousItem(value){
 setState(() {item = value});
 }
}

子类

class Child extends StatefulWidget {
 @override
 _ChildState createState() => _ChildState();
 }

class _ChildState extends State<Child> {
 @override
 Widget build(BuildContext context) {
   return Container(
  child: FlatButton(
    color: Color(0XFFEFEFEF),
    textColor: primaryColor,
    disabledColor: Colors.grey,
    disabledTextColor: Colors.black,
    padding: EdgeInsets.symmetric(
        vertical: 15.0, horizontal: 10.0),
    onPressed: () => goToPreviousItem(2),
    child: Text(
      "Update",
    ),
  ),
);
   }
 }

我该如何做到这一点?

2个回答

21
在您的子widget中创建一个Function类型的参数。
class Child extends StatefulWidget {

 Function function;
 Child({this.function});

 @override
_ChildState createState() => _ChildState();
}

class _ChildState extends State<Child> {
@override
Widget build(BuildContext context) {
 return Container(
child: FlatButton(
 color: Color(0XFFEFEFEF),
 textColor: primaryColor,
 disabledColor: Colors.grey,
 disabledTextColor: Colors.black,
 padding: EdgeInsets.symmetric(
     vertical: 15.0, horizontal: 10.0),
 onPressed: () => widget.function(2),
 child: Text(
   "Update",
         ),
      ),
    );
  }
}
  • 将函数goToPreviousItem作为参数从父部件传递到子部件。

  • Child(function: goToPreviousItem);
    
  • 在子窗口中使用widget.function(2)即可访问您的函数。


  • 1
    typedef parentFunctionCallback = void Function(String value);
    
    class Parent extends StatefulWidget {
      @override
      _ParentState createState() => _ParentState();
    }
    
    class _ParentState extends State<Parent> {
      String item = 'data';
      
      @override
      Widget build(BuildContext context) {
        return ChildClass(goToPreviousItem);
      }
      
      goToPreviousItem(String value){
        setState(() {item = value;});
      }
    }
    
    class ChildClass extends StatefulWidget {
      const ChildClass(this.parentfunc);
      
      /// ToDo
      final parentFunctionCallback parentfunc; 
      
      @override
      _ChildState createState() => _ChildState();
    }
    
    class _ChildState extends State<ChildClass> {
      @override
      Widget build(BuildContext context) {
        return Container(
          child: FlatButton(
            color: Color(0XFFEFEFEF),
            textColor: primaryColor,
            disabledColor: Colors.grey,
            disabledTextColor: Colors.black,
            padding: EdgeInsets.symmetric(
                vertical: 15.0, horizontal: 10.0),
            onPressed: () => widget.parentfunc('mail'),
            child: Text(
              "Update",
            ),
          ),
        );
      }
    }
    

    网页内容由stack overflow 提供, 点击上面的
    可以查看英文原文,
    原文链接