在 Flutter 中更新小部件外部的变量？答案

【问题标题】：Update variable outside a widget in Flutter?在 Flutter 中更新小部件外部的变量？
【发布时间】：2023-01-04 22:46:21
【问题描述】：

调用小部件时是否可以更新小部件外部的变量？这是一个例子：

class Widget1 extends StatefulWidget {

  @override
  State<Widget1> createState() => _Widget1State();
}

class _Widget1State extends State<Widget1> {
  String example = 'A';

  @override
  Widget build(BuildContext context) {
    return Column(children: [
      Text(example),
      Widget2(example: example)
    ],);
  }
}

class Widget2 extends StatefulWidget {
  final String example;

  Widget2({required this.example});

  @override
  State<Widget2> createState() => _Widget2State();
}

class _Widget2State extends State<Widget2> {

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () => setState(() {
        widget.example = 'B'
      }),
      child: Text('update !'),
    );
  }
}

这里的想法是我想使用小部件外部的按钮更新example。

此代码不起作用：example = 'A' 无论我是否单击按钮，但我不明白为什么，因为我正在调用相同的变量。

有没有一个简单的解决方案来实现这一目标？（简单来说，我的意思是不需要 Provider 或其他。）

【问题讨论】：

标签： flutter dart dart-null-safety

【解决方案1】：

您可以使用回调方法。需要更新父控件，因此需要在 Widget1 上触发 setState。

class Widget1 extends StatefulWidget {
  @override
  State<Widget1> createState() => _Widget1State();
}

class _Widget1State extends State<Widget1> {
  String example = 'A';

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(example),
        Widget2(
          example: example,
          callback: (p0) {
            setState(() {
              example = p0;
            });
          },
        ),
      ],
    );
  }
}

class Widget2 extends StatefulWidget {
  final String example;
  final Function(String) callback;
  Widget2({
    required this.example,
    required this.callback,
  });

  @override
  State<Widget2> createState() => _Widget2State();
}

class _Widget2State extends State<Widget2> {
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () {
        widget.callback("new data");
      },
      child: Text('update !'),
    );
  }
}

【讨论】：