Flutter：如何设置父小部件的状态

如何解决Flutter：如何设置父小部件的状态

我想使用子小部件中的按钮更改父容器的颜色。 假设我有一个 parentClass 小部件和一个 childClass 小部件。动态颜色的容器在parentClass，按钮在childClass。起初容器是蓝色的，我想让它在按钮点击时变成红色。

Color dynamicColor;

class ParentClass extends StatefulWidget {
  ParentClass({Key key}) : super(key: key);

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

class _ParentClassstate extends State<ParentClass> {
  @override
  void initState() {
    super.initState();
    setState(() {
      dynamicColor = Colors.blue;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        ChildClass(),Container(
          color: dynamicColor,child: ...
        )
      ],);
  }
}

class ChildClass extends StatefulWidget {
  ChildClass({Key key}) : super(key: key);

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

class _ChildClassstate extends State<ChildClass> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: TextButton(
        onpressed: () {
          setState(() {
            dynamicColor = Colors.red; // What I want to do
          });
        },child: Text('Change parent container color'),),);
  }
}

解决方法

您可以在父小部件上创建一个函数并通过参数传递给子部件。 喜欢：

void delete() async {
  setState(() {
    dynamicColor = Colors.blue;
  });
 }

在您的小部件树上

 CustomChild(function: () => delete()),

您的自定义小部件

class CustomChild extends StatelessWidget {
  Function function;
  CustomChild({this.function})
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}