如何解决登录后如何从 rest API 获取 Flutter Provider 状态一次?
我想知道从 API 获取我需要的所有 Provider 状态的最佳方法是什么。登录后我不会在主屏幕上执行此操作,因为 initState() 在我从另一个屏幕导航回来时总是会被调用。
现在,我的方法是创建一个仅在登录后构建的 LoadScreen 小部件。在那里我使用 FutureBuilder 加载我需要的状态,然后导航到 Main。这种方法会产生异常但“有效”。什么是正确的方法?
import 'package:Flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:shop/providers/auth.dart';
import 'package:shop/providers/collections.dart';
import 'package:shop/providers/customers.dart';
import 'package:shop/providers/orders.dart';
import 'package:shop/providers/products.dart';
import 'package:shop/providers/recommended_categories.dart';
import 'package:shop/providers/user_data.dart';
import 'package:shop/screens/main_screen.dart';
class LoadScreen extends StatelessWidget {
static const routeName = '/load-screen'; //It shouldn't never be used.
@override
Widget build(BuildContext context) {
Future<bool> loadState() async {
//Loading all state data from firebase
print('Loading States');
try {
final authData =
await Provider.of<Auth>(context,listen: false).authData;
final futures = <Future<dynamic>>[
Provider.of<Products>(context,listen: false)
.fetchAndSet(authData),//Products
Provider.of<RecommendedCategories>(context,Provider.of<Customers>(context,listen: false).fetchAndSet(authData),Provider.of<Orders>(context,Provider.of<UserData>(context,Provider.of<Collections>(context,];
print('Created futures list');
final results = await Future.wait(futures);
print(results);
} catch (error,stacktrace) {
print(error);
print(stacktrace);
throw error;
}
return true;
}
return Scaffold(
body: FutureBuilder(
future: loadState(),builder: (context,snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.hasError) {
return Center(
child: Text('${snapshot.error}'),);
}
Navigator.of(context).pushNamed(MainScreen.routeName);
return Center(
child: Text('Loading...'),);
} else {
return Center(
child: Text('Loading...'),);
}
},),);
}
}
我主要是
import 'package:Flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:shop/providers/collections.dart';
import 'package:shop/providers/customers.dart';
import 'package:shop/providers/products.dart';
import 'package:shop/providers/recommended_categories.dart';
import 'package:shop/providers/user_data.dart';
import 'package:shop/screens/add_collection_screen.dart';
import 'package:shop/screens/add_order_screen.dart';
import 'package:shop/screens/load_screen.dart';
import 'package:shop/screens/products_screen.dart';
import 'package:shop/screens/customer_order_screen.dart';
import 'package:shop/screens/edit_customer_screen.dart';
import 'package:shop/screens/main_screen.dart';
//import './screens/products_overview_screen.dart';
import 'screens/cart_screen.dart';
import './screens/product_detail_screen.dart';
import './providers/cart.dart';
import './providers/orders.dart';
import './providers/auth.dart';
import './screens/orders_screen.dart';
import './screens/auth_screen.dart';
import './screens/splash-screen.dart';
import './screens/collections_screen.dart';
// import './screens/collection_products_screen.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
print('MyApp.build');
return MultiProvider(
providers: [
ChangeNotifierProvider(
//Recommended approach when a new object is provided.
create: (ctx) => Auth(),ChangeNotifierProvider<Products>(
//Recommended approach when a new object is provided.
create: (ctx) => Products(),ChangeNotifierProvider(
create: (ctx) => Cart(),ChangeNotifierProvider<Orders>(
create: (ctx) => Orders(),ChangeNotifierProvider(
create: (ctx) => Customers(),ChangeNotifierProvider(
create: (ctx) => RecommendedCategories(),ChangeNotifierProvider(
create: (ctx) => UserData(),ChangeNotifierProvider(
create: (ctx) => Collections(),],child: Consumer<Auth>(
builder: (ctx,auth,_) => MaterialApp(
title: 'Shop',theme: ThemeData(
primarySwatch: Colors.deepOrange,accentColor: Colors.purple,fontFamily: 'Lato',home: auth.canAuth
? LoadScreen()
: FutureBuilder(
future: auth.tryAutoLogin(),builder: (ctx,authResultSnapshot) =>
authResultSnapshot.connectionState ==
ConnectionState.waiting
? SplashScreen()
: AuthScreen(),routes: {
ProductDetailScreen.routeName: (ctx) => ProductDetailScreen(),CartScreen.routeName: (ctx) => CartScreen(),OrdeRSScreen.routeName: (ctx) => OrdeRSScreen(),CollectionProductsScreen.routeName: (ctx) =>
CollectionProductsScreen(),CollectionsScreen.routeName: (ctx) => CollectionsScreen(false),EditCustomerScreen.routeName: (ctx) => EditCustomerScreen(),CustomerOrderScreen.routeName: (ctx) => CustomerOrderScreen(),AddOrderScreen.routeName: (ctx) => AddOrderScreen(),AddCollectionScreen.routeName: (ctx) => AddCollectionScreen(),LoadScreen.routeName: (ctx) => LoadScreen(),MainScreen.routeName: (ctx) => MainScreen(),},);
}
}
我收到以下异常
Exception caught by widgets library ═══════════════════════════════════
The following assertion was thrown building FutureBuilder<bool>(dirty,state: _FutureBuilderState<bool>#547fc):
setState() or markNeedsBuild() called during build.
This Overlay widget cannot be marked as needing to build because the framework is already in the process of building widgets. A widget can be marked as needing to be built during the build phase only if one of its ancestors is currently building. This exception is allowed because the framework builds parent widgets before children,which means a dirty descendant will always be built. Otherwise,the framework might not visit this widget during this build phase.
The widget on which setState() or markNeedsBuild() was called was: Overlay-[LabeledGlobalKey<OverlayState>#68f4a]
state: OverlayState#77296(tickers: tracking 0 tickers,entries: [OverlayEntry#847ca(opaque: true; maintainState: false),OverlayEntry#7a334(opaque: false; maintainState: true),OverlayEntry#9e3e0(opaque: false; maintainState: false),OverlayEntry#99d1e(opaque: false; maintainState: true)])
The widget which was currently being built when the offending call was made was: FutureBuilder<bool>
dirty
state: _FutureBuilderState<bool>#547fc
The relevant error-causing widget was
FutureBuilder<bool>
lib/screens/load_screen.dart:48
When the exception was thrown,this was the stack
#0 Element.markNeedsBuild.<anonymous closure>
package:Flutter/…/widgets/framework.dart:4138
#1 Element.markNeedsBuild
package:Flutter/…/widgets/framework.dart:4153
#2 State.setState
package:Flutter/…/widgets/framework.dart:1287
#3 OverlayState.rearrange
package:Flutter/…/widgets/overlay.dart:436
#4 NavigatorState._flushHistoryUpdates
package:Flutter/…/widgets/navigator.dart:4043
...
════════════════════════════════════════════════════════════════════════════════
E/Flutter ( 5098): [ERROR:Flutter/lib/ui/ui_dart_state.cc(186)] Unhandled Exception: 'package:Flutter/src/widgets/navigator.dart': Failed assertion: line 2997 pos 18: '!navigator._debugLocked': is not true.
E/Flutter ( 5098): #0 _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:46:39)
E/Flutter ( 5098): #1 _AssertionError._throwNew (dart:core-patch/errors_patch.dart:36:5)
E/Flutter ( 5098): #2 _RouteEntry.handlePush.<anonymous closure>
package:Flutter/…/widgets/navigator.dart:2997
E/Flutter ( 5098): #3 TickerFuture.whenCompleteOrCancel.thunk
package:Flutter/…/scheduler/ticker.dart:407
E/Flutter ( 5098): #4 _rootRunUnary (dart:async/zone.dart:1362:47)
E/Flutter ( 5098): #5 _CustomZone.runUnary (dart:async/zone.dart:1265:19)
E/Flutter ( 5098): #6 _FutureListener.handleValue (dart:async/future_impl.dart:152:18)
E/Flutter ( 5098): #7 Future._propagatetoListeners.handleValueCallback (dart:async/future_impl.dart:704:45)
E/Flutter ( 5098): #8 Future._propagatetoListeners (dart:async/future_impl.dart:733:32)
E/Flutter ( 5098): #9 Future._completeWithValue (dart:async/future_impl.dart:539:5)
E/Flutter ( 5098): #10 Future._asyncCompleteWithValue.<anonymous closure> (dart:async/future_impl.dart:577:7)
E/Flutter ( 5098): #11 _rootRun (dart:async/zone.dart:1354:13)
E/Flutter ( 5098): #12 _CustomZone.run (dart:async/zone.dart:1258:19)
E/Flutter ( 5098): #13 _CustomZone.runGuarded (dart:async/zone.dart:1162:7)
E/Flutter ( 5098): #14 _CustomZone.bindCallbackGuarded.<anonymous closure> (dart:async/zone.dart:1202:23)
E/Flutter ( 5098): #15 _microtaskLoop (dart:async/schedule_microtask.dart:40:21)
E/Flutter ( 5098): #16 _startMicrotaskLoop (dart:async/schedule_microtask.dart:49:5)
解决方法
我建议您从 futurebuilder 迁移到 streambuilder,然后尝试您的提供商。我不喜欢未来构建器,因为每次小部件状态更改时,都会调用未来构建器。服务器的流量增加。提供程序遵循以下语法:Provider.of
查看 streambuilder 和 bloc 事件和数据模式
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。