Flutter钩使用构建期间调用的useEffect - setState()或markNeedsBuild()获取数据

bsxbgnwa  于 2023-01-10  发布在  Flutter
关注(0)|答案(3)|浏览(179)

目前正在探索functional_widget和flutter_hooks,我对reactjs有着同样的想法,我用下面的代码来获取数据。

@hwidget
Widget homeScreen(BuildContext context) {
  TodoListProvider model = Provider.of<TodoListProvider>(context);
  useEffect(() {
    print('effect');
    model.fetchList();
    return () => {};
  }, []);
  return Scaffold(
    appBar: _buildAppbar(context, model),
    bottomNavigationBar: _buildBottomNav(context, model),
    floatingActionButton: _buildFloatingAction(context),
    body: PageTransitionSwitcher(
      duration: const Duration(milliseconds: 300),
      reverse: model.reverse,
      transitionBuilder: (
        Widget child,
        Animation<double> animation,
        Animation<double> secondaryAnimation,
      ) {
        return SharedAxisTransition(
          child: child,
          animation: animation,
          secondaryAnimation: secondaryAnimation,
          transitionType: SharedAxisTransitionType.horizontal,
        );
      },
      child: _getCurrentTab(model.currentIndex),
    ),
  );
}

我不认为这是正确的方法,因为它会抛出错误。

xzabzqsa

xzabzqsa1#

以下问题:

useEffect(() {
    model.fetchList();
  }, []);

fetchList是在构建和修改祖先小部件内部同步调用的,这是不好的。
您可以将fetchList调用 Package 在一个微任务中:

useEffect(() {
    Future.microtask(() => model.fetchList());
  }, []);
hwamh0ep

hwamh0ep2#

我知道这个问题很老了。但是我希望我的答案能帮助到一些人。我通过在下一帧中调用函数解决了这个问题

useEffect(() {
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      model.fetchList();
    }
}, []);
h5qlskok

h5qlskok3#

我个人使用useEffect()进行单位为腕尺的init调用,如下所示:

final cubit = useCubit<BooksListCubit>();
final state = useCubitBuilder<BooksListCubit, BooksListPageState>(cubit);

useEffect(
  () {
    cubit.init();
    return null;
  },
  [cubit],
);

在我的扩展Flutter cubits + hooks + Hive tutorial中有更多关于这方面的内容。

相关问题