GIfatahTH
commented
2 years ago Hi @indigo-dev and thank you for this very good issue.
A first workaround is to use RM.injectinstead of RM.create. Like this:
@override
Widget build(BuildContext context) {
return WhenRebuilder(
observe: () => RM.inject(() => WikiImageStore(
wikiRepository: Injector.get<WikiRepository>())), //_storeRM,
initState: (_, storeRM) => storeRM.setState(
(_) => wikiUrl != null ? storeRM.state.getWikiImageUrl(wikiUrl) : null),
onIdle: () => Container(),
onWaiting: () => _buildImageContainer(_buildImagePlaceHolder()),
onData: (store) => _buildImageContainer(store.imageUrl != null
? _buildImage(store.imageUrl)
: _buildImagePlaceHolder()),
onError: (_) => _buildImageContainer(_buildImagePlaceHolder()),
);
}Try it and feed me back.
For the inherited state, it needs more investigation and I'ill be back.
indigo-dev
amoslai5128
Even after reading all resources covering local states I was still not able to figure out how to solve my current problem using v5.0.0.
My app makes use of some (highly) reusable widgets (image avatars) that have its own "mini-store / view model" which takes care of downloading an image resource. As this widgets occur multiple times on a single page, they all need their own reactive model with its own state.
I'm very used to the "old way" states rebuilder worked (using it for 2 years), but due to migration to null safety and so on it was time to upgrade the package.
In the old days, I used RM.create() to obtain a reactive model that was not injected globally. So each widget had its very own instance of the "mini-store / view model" and the corresponding reactive model to handle the local state. In combination with WhenRebuilder my setup worked as expected. In the observe parameter, I created the new local RM instance, and within the initState method I told the RM to start downloading the image and handle state, see Code below ("OLD WAY").
Now moving forward and using states rebuilder version ^5.0.0, I have some really hard time making this setup work by using .inherited as the docs tell me.
First, I globally inject the mini-store (aka wikiImageStoreInjected) with throw UnimplementedError(), as mentioned in the docs. Second, I use the global variable with .inherited() in the widget tree, to create a local instance at that place in the widget tree. The two important params here are statesOverride and builder.
As parameter for statesOverride, I return a fresh instance of WikiImageStore(...). Additionally, in the builder parameter, I create the avatar widget and try to access the downloaded image via wikiImageStoreInjected.of(context).imageUrl.
Problem is: where would I tell the local RM / mini-store to download the image and call setState? a) In the statesOverride Parameter, I only have access to the local singleton but not not to the local RM which would allow me to call localRM.setState((s)=> s.getImage()). b) in the builder method, by using wikiImageStore.of(context), it's the same problem. a + b) I tried calling wikiImageStore.of(context).getImage() wihtout the use of an RM, and the image will be downloaded, but the widgets won't display because of missing setState statement. (Using hot reload forces state update and then I can see the images) c) in the builder method, instead of using .of() but using wikiImageStore(context), I can access a RM, but calling wikiImageStore(context).setState(...) gives me errors telling me that the widget is already being built and I cannot mark it as needToRebuild again.
So to make it short: how to handle setState statements (e.g. for fetching data/use of futures) within .inherited structure?
OLD WAY
NEW WAY:
Error message displayed when calling wikiImageStoreInjected(context).setState():
Exception has occurred. FlutterError (setState() or markNeedsBuild() called during build. This StateBuilderBase<_OnWidget<Widget>> 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: StateBuilderBase<_OnWidget<Widget>> The widget which was currently being built when the offending call was made was: OnBuilder<DriverDetailStore>)