Flutter call the parent component sub-assembly method to modify the parent component parameters

The main realization child component calls component methods parent is the parent component sub-assemblies passed to a method, and then call the parent method to modify the parent argument in the sub-assembly. Look at the renderings

Parent component implementation

In writing a parent component _editParentText method of modifying components contentText value and passed to the method at the time of introduction of subassembly

class PageParent extends StatefulWidget {
  @override
  _PageParentState createState() => _PageParentState();
}

class _PageParentState extends State<PageParent> {
  String contentText;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('父级组件'),
      ),
      body: Container(
        alignment: Alignment.center,
        child: Column(
          children: <Widget>[
            Container(
              padding: EdgeInsets.all(20),
              child: Column(
                children: <Widget>[
                  Text ( 'parent component parameters here',),
                  The Text ( 'contentText $ {}', style: the TextStyle (Color: Colors.red),) 
                ], 
              ), 
            ), 
            PageChildren (editParentText: (EditText) => _editParentText (EditText)) // subassembly to pass _editParentText () method 
          ], 
        ), 
      ), 
    ); 
  }  // parameter modification contentText 
  _editParentText (EditText) { 
    the setState (() { 
      contentText = EditText; 
    }); 
  } 
}

  

Child page is to achieve

In the page defined in a child editParentText method for receiving a pass over the parent, and then directly through widget.editParentText ( 'returned parameters') i.e. call parent component _editParentText method

class PageChildren extends StatefulWidget {
  final editParentText;
  const PageChildren({Key key, this.editParentText}) : super(key: key);
  @override
  _PageChildrenState createState() => _PageChildrenState();
}

class _PageChildrenState extends State<PageChildren> {
  TextEditingController _controller = TextEditingController();
  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      color: Colors.grey,
      child: Column(
        children: <Widget>[
          Text('这里是子级组件'),
          Container(
            width: 200,
            Color: Colors.white, 
            margin: EdgeInsets.symmetric (Vertical: 30), 
            Child: the TextField ( 
              Controller: _controller, 
            ), 
          ), 
          RaisedButton ( 
            Child: the Text ( 'modify parameters'), 
            onPressed: () { 
              the setState (() { 
                widget.editParentText (_controller.text); // call the assembly method of the parent 
              }); 
            } 
          ) 
        ], 
      ), 
    ); 
  } 

}

  

 

Guess you like

Origin www.cnblogs.com/gxsyj/p/11121002.html