为啥传递 BuildContext 会说该上下文中没有 Scaffold?

Posted

技术标签:

【中文标题】为啥传递 BuildContext 会说该上下文中没有 Scaffold?【英文标题】:Why does passing BuildContext say there is no Scaffold in that Context?为什么传递 BuildContext 会说该上下文中没有 Scaffold? 【发布时间】:2018-12-06 06:07:26 【问题描述】:
import 'package:flutter/material.dart';

main() 
  runApp(MaterialApp(
    home: HomeScreen(),
  ));


class HomeScreen extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Rite.ly'),
      ),
      body: new Container(
          decoration: new BoxDecoration(
              image: new DecorationImage(
            image: new AssetImage('assets/login_background.png'),
            fit: BoxFit.fill,
          )),
          child: new ListView(
            children: [
              new Padding(
                padding:
                    const EdgeInsets.only(top: 16.0, bottom: 8.0, left: 16.0),
                child: new Text('Link : ',
                    style: new TextStyle(color: Colors.white)),
              ),
              _takeUrl(context),
            ],
          )),
    );
  


Widget _takeUrl(BuildContext context) 
  return new Container(
      margin: new EdgeInsets.symmetric(horizontal: 20.0),
      decoration: new BoxDecoration(
          color: Colors.white, borderRadius: new BorderRadius.circular(12.0)),
      child: new Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          new Expanded(
            child: new Column(
              children: [
                new TextField(
                  decoration: new InputDecoration(
                      contentPadding: const EdgeInsets.all(16.0),
                      hintText: 'Link to be Shortened'),
                ),
              ],
            ),
          ),
          new IconButton(
            icon: new Icon(
              Icons.content_paste,
              color: Color.fromARGB(255, 191, 53, 146),
            ),
            onPressed: () 
              Scaffold.of(context).showSnackBar(new SnackBar(
                    content: new Text('Hello!'),
                  ));
            ,
          )
        ],
      ));

在上面的代码中,将上下文传递给与构建方法分离的片段,当调用 Scaffold.of 时会出错:

I/flutter (20313): Another exception was thrown: Scaffold.of() called with a context that does not contain a Scaffold.

但是,当我们使用 Builder 小部件并将 _takeURL 作为 builder 传递给 Builder 时,这个问题就得到了解决。之后,小吃店就可以正常工作了。

可能是什么原因?我需要阅读哪些内容才能了解原因?

class HomeScreen extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Rite.ly'),
      ),
      body: new Container(
          decoration: new BoxDecoration(
              image: new DecorationImage(
            image: new AssetImage('assets/login_background.png'),
            fit: BoxFit.fill,
          )),
          child: new ListView(
            children: [
              new Padding(
                padding:
                    const EdgeInsets.only(top: 16.0, bottom: 8.0, left: 16.0),
                child: new Text('Link : ',
                    style: new TextStyle(color: Colors.white)),
              ),
              Builder(builder: _takeUrl,),
            ],
          )),
    );
  

【问题讨论】:

您好,在这种情况下不要使用代码 sn-p。代码 sn-p 用于您可以在浏览器中实际运行的代码(例如 html/JS)。这里只使用代码示例 【参考方案1】:

传递的上下文不是Scaffold.of(context) 需要的上下文。您需要将其包装在 Builder 中,因为 Flutter BuildContext 指定:

Widget _takeUrl(BuildContext context) 
return Builder(builder: (BuildContext context) 
    return new Container(
        margin: new EdgeInsets.symmetric(horizontal: 20.0),
        decoration: new BoxDecoration(
            color: Colors.white, borderRadius: new BorderRadius.circular(12.0)),
        child: new Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
            new Expanded(
            child: new Column(
                children: [
                new TextField(
                    decoration: new InputDecoration(
                        contentPadding: const EdgeInsets.all(16.0),
                        hintText: 'Link to be Shortened'),
                ),
                ],
            ),
            ),
            new IconButton(
            icon: new Icon(
                Icons.content_paste,
                color: Color.fromARGB(255, 191, 53, 146),
            ),
            onPressed: () 
                Scaffold.of(context).showSnackBar(new SnackBar(
                    content: new Text('Hello!'),
                    ));
            ,
            )
        ],
        ));
);

【讨论】:

看起来,这已在 BuildContext 的文档中正确记录。谢谢!【参考方案2】:

我将调用Scaffold.of(context) 函数的小部件包装在StreamBuilder 中:

【讨论】:

以上是关于为啥传递 BuildContext 会说该上下文中没有 Scaffold?的主要内容,如果未能解决你的问题,请参考以下文章

如何传递上下文以在颤动中显示 AlertDialog

flutter系列之:构建Widget的上下文环境BuildContext详解

参数类型“jsObject”不能分配给“buildContext”参数?

与Redux一起颤抖:如何从中间件显示警报?我在哪里可以获得BuildContext

如何在有状态或无状态小部件之外访问 BuildContext?

为啥 Windows 命令 shell 告诉我使用不同的命令,然后说该命令不存在?