Flutter：如何获取父级Widget的变量？

Question

我使用以下示例进行测试和学习如何从子窗口小部件调用父函数。 当您单击TestButton时，将调用countRefresh函数，并且变量计数会增加1。 现在，每次单击它时，按钮都会更改颜色（蓝色或红色）。

问题：假设我想根据围绕计数变量的某些逻辑更改颜色，如何从TestButton小部件中访问计数变量？ 例如，如果count是三的倍数，则应将按钮设置为红色，否则为蓝色。

我阅读了InheritedWidgets的相关资料，但似乎必须将变量定义为InheritedWidgets内部final（如果我在int count = 0;之前不放置final，则会收到“此类被标记为不可变”消息错误）。 但是基于此示例，我需要每次单击按钮时更改count。 除了InheritedWidgets，还有什么替代方法？

import 'package:flutter/material.dart';

class Test extends StatefulWidget {
  static const String id = 'test';
  @override
  _TestState createState() => _TestState();
}

class _TestState extends State<Test> {
  int count = 0;
  Color color = Colors.red;

  void refreshCount() {
    setState(() {
      count += 1;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child:
            Text('The button was pressed $count time${count == 1 ? '' : 's'}'),
      ),
      floatingActionButton: TestButton(
        color: color,
        notifyParent: refreshCount,
      ),
    );
  }
}

class TestButton extends StatefulWidget {
  TestButton({
    @required this.color,
    @required this.notifyParent,
  });
  final Color color;
  final void Function() notifyParent;
  @override
  _TestButtonState createState() => _TestButtonState();
}

class _TestButtonState extends State<TestButton> {
  Color color;
  void initState() {
    color = widget.color;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        widget.notifyParent();
        setState(() {
          color = color == Colors.red ? Colors.blue : Colors.red;
        });
      },
      child: Container(
        child: Icon(
          Icons.add,
          size: 80,
        ),
        color: color,
      ),
    );
  }
}

- Pigna

---

阅读有关Flutter的状态管理和BLoC/Redux/ScopedModel的内容。 - Kirill Matrosov

Answer 1

我希望基于计数变量的某些逻辑更改颜色，如何从TestButton部件中访问计数变量？例如，如果计数是三的倍数，则按钮应为红色，否则为蓝色。

您需要将count传递给子组件，并让子组件根据该值构建自身。

不要尝试访问父级部件。在声明式编程中，您只能更新状态并重建树。

这是关于Flutter状态管理的一个很好的视频：https://www.youtube.com/watch?v=HrBiNHEqSYU

- Andrey Gordeev

---

是的，我考虑过这个！但如果我有多个需要访问该变量的子项呢？我应该将其传递给它们吗？最糟糕的情况是：假设我有数百/数千个需要该父变量的子部件。这不是有些浪费吗？ - Pigna

那么使用Provider。请看我提到的视频。 - Andrey Gordeev

正如@AndreyGordeev所说，您需要检查Provider等状态管理方法。以下是Flutter的公共文档链接：https://docs.flutter.dev/development/data-and-backend/state-mgmt/options我敢打赌您想要根据状态更改自由访问、更改和更新小部件。Provider或GetX非常适合此类需求。 - alones