Flutter / Dart: Могу ли я иметь несколько виджетов с состоянием в моем дереве виджетов?

• У родителей нет доступа к дочерним виджетам / состояниям, только наоборот. Таким образом, вы не можете импортировать самый нижний виджет с отслеживанием состояния вниз по дереву в мой виджет верхнего уровня.

• Вам нужно только поднять состояние, когда вы хотите разделить это состояние между разными ветвями дерева виджетов. Затем дети могут найти родителя и получить доступ к общему состоянию.

• Не бойтесь StatefulWidget - вы можете использовать столько, сколько вам нужно

• Изучите решения для управления состоянием Flutter, которые существуют именно для разделения вещей (ChangeNotifier, Provider, BLOC, Redux и т. Д.)

Могу ли я иметь несколько виджетов с состоянием в моем дереве виджетов?

Ответ: да, вы можете создать несколько StatefulWidget в своем виджете. Вы также можете создать callback функцию из самого нижнего StatefulWidget с помощью Function(yourcallback). На мой взгляд, flutter также поддерживает базовую модель компонентов и делает его максимально динамичным для настройки нашего собственного виджета.

Например:

дочерний виджет

дочерний виджет имеет свое состояние.

class Child extends StatefulWidget {
  final int counter;
  final Function(int childCounter) callback; //here is your callback
  const Child({
    Key key,
    this.counter,
    this.callback,
  }) : super(key: key);
  @override
  _ChildState createState() => _ChildState();
}

class _ChildState extends State<Child> {
  String _childState = '';

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.green[400],
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Text("Child"),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              IconButton(
                  icon: Icon(Icons.exposure_minus_1_rounded),
                  onPressed: () {
                    this.widget.callback(this.widget.counter - 1); //here is your callback
                    setState(() {
                      _childState = "minus one";
                    });
                  }),
              IconButton(
                  icon: Icon(Icons.plus_one_rounded),
                  onPressed: () {
                    this.widget.callback(this.widget.counter + 1); //here is your callback
                    setState(() {
                      _childState = "plus one";
                    });
                  })
            ],
          ),
          Text(_childState)
        ],
      ),
    );
  }
}

Родительский виджет

родитель получает обратный вызов от ребенка.

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

class _ParentState extends State<Parent> {
  int _counter = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Multiple State"),
      ),
      body: Container(
        child: Column(
          children: [
            Child(
              counter: _counter,
              callback: (childCounter) { //here is callback from the child
                print(childCounter);
                setState(() {
                  _counter = childCounter;
                });
              },
            ),
            Text("Parent"),
            Center(
              child: Text(_counter.toString()),
            )
          ],
        ),
      ),
    );
  }
}

чтобы изменить дочернее состояние от его родительского

вы можете использовать didUpdateWidget() здесь вы можете увидеть документы