Flutter initState生命周期中获取上下文对象

Flutter initState生命周期中获取上下文对象

一、问题描述：

1、在进行数据请求，如果请求异常我们需要给用户提示；

NssToast().init(context).showToast(
  message: e.message.toString(),
  gravity: ToastGravity.top,
  toastType: NssToastType.error,
);

2、如果打开详情页，我们需要获取上个页面通过命名的路由传递过来的参数id，在数据请求时带上。

@override
void initState() {
  super.initState();
  // initAsyncData需要使用上个页面传递过来的type类型
  initAsyncData(1);
}
initAsyncData(type) async {
  var data = await MessageService().init(context).getNoticeList(type);
  setState(() {
    _messageData = data['page']['records'];
  });
}

以上两个问题的共同点都是依赖于本页面的上下文对象。

为什么不能放在build或者didChangeDependencies中进行数据请求？

因为 build或者didChangeDependencies 可以在组件的生命周期中多次调用，造成不必要的网络请求。

二、解决方案

遇到以上场景我们就可以使用Future.delayed将任务延迟进行。

关于为什么在Future.delayed中我们可以获取上下文对象，请查看下面这篇文章。

flutter微任务队列以及future.delayed - 简书

这样我们就可以将我们的代码修改为如下所示：

@override
void initState() {
  super.initState();
  Future.delayed(Duration.zero, () {
    // 获取路由传参
    dynamic arguments = ModalRoute.of(context)?.settings.arguments;
    // 调用数据请求的方法
    initAsyncData(arguments['messageInfo']['type']);
  });
}
initAsyncData(type) async {
  var data = await MessageService().init(context).getNoticeList(type);
  setState(() {
    _messageData = data['page']['records'];
  });
}

三、往期内容已全部收录在专栏中：

Flutter专栏_WEB前端李志杰的博客-CSDN博客

Vue专栏_WEB前端李志杰的博客-CSDN博客