如何在 Flutter 中的选项卡之间发送数据？

Question

我有一个带有 2 个选项卡的 Flutter 应用程序：一个管理和接收连续的数据流，另一个选项卡显示传入的数据。

如何将数据从第一个选项卡传递到第二个选项卡？我看到的大部分帖子都是关于在父母和孩子之间传递数据，而不是孩子到孩子。

我会用GlobalKey吗？有更好的选择吗？

这是主要的构建功能：

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('some text'),
      bottom: TabBar(
        tabs: tabs,
        controller: _tabController,
      ),
    ),
    body: TabBarView(
      controller: _tabController,
      children: [
        InputManagment(),
        InfiniteListView(),
      ],
    ),
  );
}

Answer 1

在这种情况下，建议使用InheritedWidget.

的文档InheritedWidget非常全面，包括Flutter 团队的视频。

首先，您可能想要创建一个类来保存要共享的数据。

import 'dart:async';

class MyInheritedWidgetData {
  var sharedData;
  int someCount;
  String someMessage;

  final StreamController _streamController = StreamController.broadcast();

  Stream get stream => _streamController.stream;

  Sink get sink => _streamController.sink;
}

我刚刚向此类添加了一堆变量。您可以用您想要的任何内容填充它。
现在，您还希望有一个InheritedWidget保存该数据类。

class MyInheritedWidget extends InheritedWidget {
  final MyInheritedWidgetData data;

  MyInheritedWidget({
    Key key,
    @required Widget child,
  })  : assert(child != null),
        data = MyInheritedWidgetData(),
        super(key: key, child: child);

  static MyInheritedWidgetData of(BuildContext context) => (context.inheritFromWidgetOfExactType(MyInheritedWidget) as MyInheritedWidget).data;

  @override
  bool updateShouldNotify(MyInheritedWidget old) => false;
}

您需要将其放置MyInheritedWidget在小部件树的顶部或至少位于您谈到的父小部件之上。下面应该说明必要的小部件层次结构。

MyInheritedWidget
 TabBarView
   InputManagment
   InfiniteListView
// in your build function this would be `body: MyInheritedWidget(child: TabBarView(...))`

现在，您可以通过MyInheritedWidget.of(context)在任何子小部件中使用来简单地访问您的数据类。

您可能需要考虑使用流来连续发送和侦听“数据流”。然而，这也只是数据类的一部分。为了给您一个想法，我在示例数据类中包含了流变量。您可以使用添加数据MyInheritedWidget.of(context).sink.add(..)并将流提供给StreamBuilderusing MyInheritedWidget.of(context).stream。

这些只是解释在小部件之间共享数据所需的示例。您可以阅读文档以获取更多信息和更高级的用例。