Flutter问题：TabBarView中的SnackBar无法显示

这个问题我之前也碰到过！核心原因是context的层级问题——你当前使用的context是MyApp组件的context，它位于Scaffold的父节点层级上，导致Scaffold.of(context)找不到对应的Scaffold实例，所以SnackBar完全无法触发。下面给你两种最常用的解决方法：

方法一：用Builder组件包裹Tab内的交互组件 #

Builder组件可以生成一个新的context，这个context属于Scaffold的子节点，能正确被Scaffold.of()识别。修改你的TabBarView代码如下：

body: new TabBarView(children: [
  new MyHomePage(),
  // 用Builder包裹RaisedButton所在的Center
  new Builder(
    builder: (BuildContext context) {
      return new Center(
        child: new RaisedButton(
          onPressed: () {
            final snackBar = new SnackBar(
              content: new Text('Yay! A SnackBar!'),
              action: new SnackBarAction(
                label: 'Undo',
                onPressed: () {
                  // 撤销操作的代码
                },
              ),
            );
            Scaffold.of(context).showSnackBar(snackBar);
          },
          child: new Text('Show SnackBar'),
        ),
      );
    },
  ),
  // 同样给IconButton用Builder包裹
  new Builder(
    builder: (BuildContext context) {
      return new Center(
        child: new IconButton(
          icon: new Icon(Icons.add),
          onPressed: () {
            final snackBar = new SnackBar(
              content: new Text('Yay! A SnackBar!'),
              action: new SnackBarAction(
                label: 'Undo',
                onPressed: () {
                  // 撤销操作的代码
                },
              ),
            );
            Scaffold.of(context).showSnackBar(snackBar);
          },
        ),
      );
    },
  ),
]),

方法二：给Scaffold设置GlobalKey #

这种方法更适合需要在多个地方调用Scaffold方法的场景，步骤如下：

1. 先定义一个GlobalKey：

final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

2. 给Scaffold绑定这个key：

child: new Scaffold(
  key: _scaffoldKey, // 绑定GlobalKey
  appBar: new AppBar(
    bottom: new TabBar(tabs: [
      new Tab(icon: new Icon(Icons.home)),
      new Tab(icon: new Icon(Icons.favorite)),
      new Tab(icon: new Icon(Icons.list))
    ]),
    title: new Text("Tabs Demo"),
  ),
  body: new TabBarView(...),
),

3. 在触发SnackBar时直接用key调用：

onPressed: () {
  final snackBar = new SnackBar(
    content: new Text('Yay! A SnackBar!'),
    action: new SnackBarAction(
      label: 'Undo',
      onPressed: () {
        // 撤销操作的代码
      },
    ),
  );
  _scaffoldKey.currentState?.showSnackBar(snackBar);
},

两种方法都能解决你的问题，如果你只是单个Tab里需要弹出SnackBar，方法一更轻量；如果多个组件都需要操作Scaffold，方法二更方便。

内容的提问来源于stack exchange，提问作者JimJay Lee