InitState 方法中的 Flutter 获取上下文

我不确定 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);
}

如果有更好的方法来做这个检查,如果需要调用模态,请告诉我正确的方向,我正在寻找一个 onState或者 onRender函数,或者一个回调函数,我可以分配给 build函数在渲染时调用,但是找不到。


编辑: 看起来这里他们有一个类似的问题: 将 Flutter 重定向到 initState 上的页面

193742 次浏览

成员变量上下文可以在 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.late:

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 元素; 显示一个包含需要添加的设置和下一个按钮的完整页面可能会更好。

Future包装

  @override
void initState() {
super.initState();
_store = Store();
new Future.delayed(Duration.zero,() {
_store.fetchContent(context);
});
}

简单使用 Timer.run()

@override
void initState() {
super.initState();
Timer.run(() {
// you have a valid context here
});
}

我们可以使用 Global key 作为:

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),
));
}




}

= = = = = = = UPDATE = = = = = = =

就像 卢卡斯 · 鲁埃达指出的那样(多亏了他:) ,当我们需要在 initState()内部得到 context以使用“ 提供者”时,我们应该将参数 listen设置为 = false。这是有意义的,因为我们不应该听 initState()阶段。所以,举个例子,它应该是:

final settingData = Provider.of<SettingProvider>(context, listen: false);

= = = = = = = = = = = = = OLD 答案 = = = = = = = = = = =

这个线程中的大多数 initState()例子可能适用于“ UI”,例如“ Dialog”,这是这个线程的根问题。

但不幸的是,它不工作时,我应用它得到 context的“ 提供者”。

因此,我选择 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):

此工作在方法构建小部件中使用一个键。

首先创建密钥:

  final GlobalKey<NavigatorState> key =
new GlobalKey<NavigatorState>();

在我们绑定我们的小部件之后:

  @override
Widget build(BuildContext context) {
return Scaffold(key:key);
}

最后,我们使用键调用. currentContext 参数。

    @override
void initState() {
super.initState();
SchedulerBinding.instance.addPostFrameCallback((_) {
// your method where use the context
// Example navigate:
Navigator.push(key.currentContext,"SiestaPage");
});
}

编程愉快。