Flutter - 从另一个有状态小部件设置一个有状态小部件的变量值

Question

我是 Flutter 的新手，这可能是一个非常棘手的问题，但我想从另一个有状态小部件设置一个有状态小部件的变量状态。

分享一个重现当前问题的小sn-p。

FirstWidget.dart

class FirstWidget extends StatefulWidget {
  @override
  _FirstWidgetState createState() => _FirstWidgetState();
}

class _FirstWidgetState extends State<FirstWidget> {

bool _isDisabled = true; 

 @override
  Widget build(BuildContext context) {
    return Container(
               // Doing Something with the flag isDisabled
);
  }
}

SecondWidget.dart

class SecondWidget extends StatefulWidget {
  @override
  _SecondWidgetState createState() => _SecondWidgetState();
}

class _SecondWidgetState extends State<SecondWidget> {

 @override
  Widget build(BuildContext context) {
    return Container(
        // Here I want to update the isDisabled Flag of the First Widget. 
);

  }
}

我基本上只是想知道如何从另一个小部件更新一个小部件的变量值。

谢谢

Answer 1

为此，您可以使用GlobalKey。 GlobalKey 用于标识小部件树中的特定小部件。

使用示例：

在 FirstWidget.dart 文件中：

class FirstWidget extends StatefulWidget {
  @override
  FirstWidgetState createState() => FirstWidgetState();
}

// Make sure your FirstWidgetState class is not private!
class FirstWidgetState extends State<FirstWidget> {

  bool _isDisabled = true;

  void enable(bool value) {
    setState(() => _isDisabled = !value);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      // Doing Something with the flag isDisabled
    );
  }
}

在 SecondWidget.dart 文件中（我稍微更改了这个文件以显示GlobalKey 的用法）：

final GlobalKey<FirstWidgetState> firstWidgetGlobalKey = new GlobalKey<FirstWidgetState>();

class SecondWidget extends StatefulWidget {
  @override
  _SecondWidgetState createState() => _SecondWidgetState();
}

class _SecondWidgetState extends State<SecondWidget> {

 @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          FirstWidget(
            key: firstWidgetGlobalKey,
          ),
          RaisedButton(
            onPressed: () {
              firstWidgetGlobalKey.currentState.enable(true);
            },
            child: Text("Enable First Widget"),
          ),
        ],
      ),
    );
  }
}

---

编辑

GlobalKey 实例在整个应用程序中是唯一的。所以使用全局键的更聪明的方法是将它们全部存储在一个单独的文件中（例如keys.dart）。在此文件中，您可以将 firstWidgetGlobalKey 和 secondWidgetGlobalKey 作为最终变量，只需导入文件即可使用它们。

一个缺点（但这是一种预期行为）是 GlobalKey 只能在它所标识的小部件当前存在于小部件树中时使用，否则您将获得空引用在currentState.

从另一个小部件访问小部件状态的另一种方法是使用InheritedWidget。因为它需要更多的努力，所以有一个很好的简单教程来展示用法：InheritedWidget Tutorial on Medium。

希望这会有所帮助！