从其他子组件的子集状态

Question

假设我们有 Car (Stateless) 类，它里面有两个类，现在它将是 Wheel (Statefull) 和 Mask (Statefull)，我的工作是每当类 Wheel 的状态改变时调用类 Mask 来改变它状态也包含来自 Wheel 的特定数据，但父级也应该有权访问子级数据。我怎样才能实现它？

import 'package:flutter/material.dart';

void main() {
  runApp(Car());
}

class Car extends StatelessWidget {
 int childMaskVal = ..??????

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Scaffold(
        appBar: AppBar(
          title: Text('App bar'),
        ),
        body: Column(
          children: <Widget>[
            Wheel(),
            Mask(),
          ],
        ),
      ),
    );
  }
}


class Wheel extends StatefulWidget {

  _WheelState createState() => _WheelState();
}

class _WheelState extends State<Wheel> {
 int _value = 0;

  @override
  Widget build(BuildContext context) {
    return Container(
       child: Column(
         children: <Widget>[
           RaisedButton(
           onPressed: () {
             setState(() {
              _value++; 
             });
           },
         ),
         Text(_value.toString()),
         ],
       ),
    );
  }
}

class Mask extends StatefulWidget {

  _MaskState createState() => _MaskState();
}

class _MaskState extends State<Mask> {
  int _value = 13;

  @override
  Widget build(BuildContext context) {
    return Container(
       child: Text((_value * Wheel._value).toString()),???????
    );
  }
}

Answer 1

您可以将回调传递给孩子。

在您提供的示例中，父级应为statefulWidget，子级应为无状态小部件。您应该在父级中初始化状态，然后将其传递给子级。

如果你发现 parent 需要访问 child 中的数据，这意味着你需要将 state 向上移动。

请看下面的例子：

import 'package:flutter/material.dart';

void main() {
  runApp(Car());
}

class Car extends StatefulWidget{
@override
  _CarState createState() => _CarState();
}

class _CarState extends State<Car> {
 int childMaskVal = ..??????
 int _value = 1;

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Scaffold(
        appBar: AppBar(
          title: Text('App bar'),
        ),
        body: Column(
          children: <Widget>[
            Wheel(
              value: _value,
              onPressed: () {
               setState(() {
                  _value++;
                  // update state here
               })
            }),
            Mask(),
          ],
        ),
      ),
    );
  }
}

class Wheel extends Stateless {
  int value;
  Function onPressed;
  Wheel({this.value, this.onPresed})

  @override
  Widget build(BuildContext context) {
    return Container(
       child: Column(
         children: <Widget>[
           RaisedButton(
           onPressed: onPressed
         ),
         Text(value.toString()),
         ],
       ),
    );
  }
}

你也可以查看这个帖子How to pass data from child widget to its parent