Flutter在initState方法中获取上下文


85

我不确定initState的功能是否正确。我想要实现的是检查何时渲染页面以执行一些检查,并根据AlertDialog需要打开一个进行一些设置。

我有一个有状态的页面。它的initState功能如下所示:

@override
void initState() {
    super.initState();
    if (!_checkConfiguration()) {
        _showConfiguration(context);
    }
}

_showConfiguration这样的:

void _showConfiguration(BuildContext context) {
    AlertDialog dialog = new AlertDialog(
        content: new Column(
            children: <Widget>[
                new Text('@todo')
            ],
        ),
        actions: <Widget>[
            new FlatButton(onPressed: (){
                Navigator.pop(context);
            }, child: new Text('OK')),
        ],
    );

    showDialog(context: context, child: dialog);
}

如果有更好的方法进行检查,并且需要调用模态,请指向正确的方向,我在寻找onStateoronRender函数,或者可以分配给build在render上调用的函数的回调,但没有能够找到一个。


编辑:它在这里接缝,它们有一个类似的问题:Flutter重定向到initState上的页面

Answers:


113

成员变量上下文可以在期间访问,initState但不能用于所有内容。这是从initState文档中扑朔迷离的:

您不能通过[BuildContext.inheritFromWidgetOfExactType]此方法使用。但是,[didChangeDependencies]将在此方法之后立即调用,并[BuildContext.inheritFromWidgetOfExactType] 可以在其中使用。

您可以将初始化逻辑移至didChangeDependencies,但是这可能并非您真正想要的,因为didChangeDependencies在小部件的生命周期中可以多次调用它。

如果您改为进行异步调用,该调用将您的调用委派给您,直到小部件初始化之后,您就可以根据需要使用上下文了。

一个简单的方法就是利用未来。

Future.delayed(Duration.zero,() {
  ... showDialog(context, ....)
}

另一种可能更“正确”的方法是使用flutter的调度程序添加后帧回调:

SchedulerBinding.instance.addPostFrameCallback((_) {
  ... showDialog(context, ....)
});

最后,这是我想在initState函数中使用异步调用的一个小技巧:

() async {
  await Future.delayed(Duration.zero);
  ... showDialog(context, ...)      
}();

这是使用简单的Future.delayed的充实示例:

import 'dart:async';

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  bool _checkConfiguration() => true;

  void initState() {
    super.initState();
    if (_checkConfiguration()) {
      Future.delayed(Duration.zero,() {
        showDialog(context: context, builder: (context) => AlertDialog(
          content: Column(
            children: <Widget>[
              Text('@todo')
            ],
          ),
          actions: <Widget>[
            FlatButton(onPressed: (){
              Navigator.pop(context);
            }, child: Text('OK')),
          ],
        ));
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
    );
  }
}

注释中提供了OP的更多背景信息,对于他们的特定问题,我可以给出稍微更好的解决方案。根据应用程序的不同,您实际上可能要根据显示的页面来做出决定,具体取决于是否是第一次打开该应用程序,即设置home为其他内容。对话框并不一定是移动设备上最好的UI元素。最好显示整页以及他们需要添加的设置和下一个按钮。


有问题的页面是第一页,并且通过MaterialApphome属性调用了该页面。所以我真的不去那里推。你能给我一个例子,如何在build函数中做到吗?目前,它只是返回一个新的ScaffoldappBardrawerbodyfloatingActionButton
瓦瓦

我想到的一个选择是将功能中模态中使用的所有小部件外包Scaffold,如果检查失败,则在首页中显示它们(不显示模态),否则仅显示主页。但是,这对我来说有点不客气。
wawa

4
这真是太糟了。您可以访问上下文的第一个地方是didChangeDependencies方法
Razvan Cristian Lung

1
@wawa-我整理了一下示例。我实际上忘记了context实际上是状态= D的成员变量。因此,您不需要布尔值,您可以直接Future.delayed在initstate中使用in。尽管如此,这仍然是必需的-如果没有它,您将在推入过程中尝试推入时遇到断言错误。
rmtmckenzie

2
在我的情况下,它在initState中说“未定义名称上下文”
temirbek


4

initState()此线程中的大多数示例可能适用于“ UI”事物,例如“ Dialog”,这是该线程的根本问题。

但是不幸的是,当我将其用于获取contextProvider ”时,它对我不起作用。

因此,我选择didChangeDependencies()方法。如已接受的答案中所述,它有一个警告,即可以在小部件的生命周期中多次调用。但是,它很容易处理。只需使用一个帮助程序变量,bool即可防止在其中进行多次调用didChangeDependencies()。这是使用_BookListState变量_isInitialized作为“多个调用”的主要“停止器”的类的示例用法:

class _BookListState extends State<BookList> {
  List<BookListModel> _bookList;
  String _apiHost;
  bool _isInitialized; //This is the key
  bool _isFetching;

  @override
  void didChangeDependencies() {
    final settingData = Provider.of<SettingProvider>(context);
    this._apiHost = settingData.setting.apiHost;
    final bookListData = Provider.of<BookListProvider>(context);
    this._bookList = bookListData.list;
    this._isFetching = bookListData.isFetching;

    if (this._isInitialized == null || !this._isInitialized) {// Only execute once
      bookListData.fetchList(context);
      this._isInitialized = true; // Set this to true to prevent next execution using "if()" at this root block
    }

    super.didChangeDependencies();
  }

...
}

这是我尝试执行initState()方法时的错误日志:

E/flutter ( 3556): [ERROR:flutter/lib/ui/ui_dart_state.cc(177)] Unhandled Exception: 'package:provider/src/provider.dart': Failed assertion: line 242 pos 7: 'context.owner.debugBuilding ||
E/flutter ( 3556):           listen == false ||
E/flutter ( 3556):           debugIsInInheritedProviderUpdate': Tried to listen to a value exposed with provider, from outside of the widget tree.
E/flutter ( 3556):
E/flutter ( 3556): This is likely caused by an event handler (like a button's onPressed) that called
E/flutter ( 3556): Provider.of without passing `listen: false`.
E/flutter ( 3556):
E/flutter ( 3556): To fix, write:
E/flutter ( 3556): Provider.of<SettingProvider>(context, listen: false);
E/flutter ( 3556):
E/flutter ( 3556): It is unsupported because may pointlessly rebuild the widget associated to the
E/flutter ( 3556): event handler, when the widget tree doesn't care about the value.
E/flutter ( 3556):
E/flutter ( 3556): The context used was: BookList(dependencies: [_InheritedProviderScope<BookListProvider>], state: _BookListState#1008f)
E/flutter ( 3556):
E/flutter ( 3556): #0      _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:46:39)
E/flutter ( 3556): #1      _AssertionError._throwNew (dart:core-patch/errors_patch.dart:36:5)
E/flutter ( 3556): #2      Provider.of
package:provider/src/provider.dart:242
E/flutter ( 3556): #3      _BookListState.initState.<anonymous closure>
package:perpus/…/home/book-list.dart:24
E/flutter ( 3556): #4      new Future.delayed.<anonymous closure> (dart:async/future.dart:326:39)
E/flutter ( 3556): #5      _rootRun (dart:async/zone.dart:1182:47)
E/flutter ( 3556): #6      _CustomZone.run (dart:async/zone.dart:1093:19)
E/flutter ( 3556): #7      _CustomZone.runGuarded (dart:async/zone.dart:997:7)
E/flutter ( 3556): #8      _CustomZone.bindCallbackGuarded.<anonymous closure> (dart:async/zone.dart:1037:23)
E/flutter ( 3556): #9      _rootRun (dart:async/zone.dart:1190:13)
E/flutter ( 3556): #10     _CustomZone.run (dart:async/zone.dart:1093:19)
E/flutter ( 3556): #11     _CustomZone.bindCallback.<anonymous closure> (dart:async/zone.dart:1021:23)
E/flutter ( 3556): #12     Timer._createTimer.<anonymous closure> (dart:async-patch/timer_patch.dart:18:15)
E/flutter ( 3556): #13     _Timer._runTimers (dart:isolate-patch/timer_impl.dart:397:19)
E/flutter ( 3556): #14     _Timer._handleMessage (dart:isolate-patch/timer_impl.dart:428:5)
E/flutter ( 3556): #15     _RawReceivePortImpl._handleMessage (dart:isolate-patch/isolate_patch.dart:168:12)
E/flutter ( 3556):

1
您有该错误,因为没有使用“ listen:false”参数。提供程序检测到未从窗口小部件树中调用(在“ build”方法内部)。
路卡斯·鲁达

1
感谢您指出@LucasRueda,看起来我在VSCode上执行了“侦听:false”或context.read(),但是正在执行“热撤消”而不是“重新启动”。收到您的消息后,在对我的提供程序应用“ listen:false”之后,我真的尝试“重新启动”。我确认这确实是由“ listen:true”或引起的context.watch()。会尽快更新我的答案。
Bayu

1

我们可以将全局密钥用作:

class _ContactUsScreenState extends State<ContactUsScreen> {

    //Declare Global Key
      final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

    //key
    Widget build(BuildContext context) {
        return  Scaffold(
            key: _scaffoldKey,
            appBar: AppBar(
              title: Text('Contact Us'),
            ),
            body:
       }

    //use
      Future<void> send() async {
        final Email email = Email(
          body: _bodyController.text,
          subject: _subjectController.text,
          recipients: [_recipientController.text],
          attachmentPaths: attachments,
          isHTML: isHTML,
        );

        String platformResponse;

        try {
          await FlutterEmailSender.send(email);
          platformResponse = 'success';
        } catch (error) {
          platformResponse = error.toString();
        }

        if (!mounted) return;

        _scaffoldKey.currentState.showSnackBar(SnackBar(
          content: Text(platformResponse),
        ));
      }


}

0

使用简单 Timer.run()

@override
void initState() {
  super.initState();
  Timer.run(() {
    // you have a valid context here
  });
}
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.