Comments (5)
I just want to add another idea for a solution to the original question.
Certainly, an action that passes the BuildContext, that can then be handled by your middleware will certainly work, but only in scenarios where you are coming from access to BuildContext.
In the scenario that I've been solving, I want to dispatch a snackbar message from my middleware i.e. in response to maybe an error from an async action or really any situation that a toast might be useful in response to a different action.
The best solution to solve this is a Receiver Widget. Essentially it is a widget that doesn't display anything, but is set up to react to changes in the store to do something within the build tree. You wrap your receiver around your body:
property on all your scaffolds and you'll be able to receive your snackbar messages from anywhere you can dispatch an action :) The one downside is the use of temp data in your store... Maybe down the road there will be a way to handle view model updates on action dispatches instead of store updates, but it's not a big deal either way.
Here's the one I wrote. You can use this same pattern for showDialog and also the other functions under Scaffold.of(context) as well. You can even create a single receiver that chains your other receivers so it is easy to add to your pages.
import "package:flutter/material.dart";
import "package:redux/redux.dart";
import "package:flutter_redux/flutter_redux.dart";
import "../../../../actions/all.dart" show Actions;
import "../../../../models/all.dart" show AppState;
import "../../../../selectors/all.dart" show getLatestToastrMessage;
class Toastr extends StatelessWidget {
final Widget child;
Toastr(this.child);
@override
Widget build(BuildContext context) {
return StoreConnector<AppState, _ToastrViewModel>(
converter: (store) => _ToastrViewModel.fromStore(store),
builder: (context, viewmodel) => child,
onWillChange: (viewModel) {
if (viewModel.toastToShow != null) {
viewModel.setShowToastSuccessful();
Scaffold.of(context).showSnackBar(viewModel.toastToShow);
}
},
distinct: true,
);
}
}
class _ToastrViewModel {
final Function setShowToastSuccessful;
final SnackBar toastToShow;
_ToastrViewModel({
this.setShowToastSuccessful,
this.toastToShow
});
static _ToastrViewModel fromStore(Store<AppState> store) {
return _ToastrViewModel(
setShowToastSuccessful: () => store.dispatch(Actions.toastr.showToast.success()),
toastToShow: getLatestToastrMessage(store)
);
}
@override
int get hashCode => toastToShow.hashCode;
@override
bool operator ==(other) =>
identical(this, other) ||
other is _ToastrViewModel &&
other.toastToShow == this.toastToShow;
}
from flutter_redux.
thanks for the example @twistedinferno, but I really couldn't wrap my head around how to apply this on my project. Because I call my actions from functions defined in the ViewModel of the Container and I can't access the application's context from there.
from flutter_redux.
This got me on the right path...
https://stackoverflow.com/questions/49887690/flutter-redux-snackbar
from flutter_redux.
Hey all, sorry about the slow response -- been traveling the past week or so. Glad ya found a solution!
@bowojori7 In that case, you can create a function in the ViewModel that takes in a context from the build
method and dispatches an action with that context.
from flutter_redux.
@DizWARE I have an issue whereby only my first screen widget seems to show my snackbars. If I click back on the Android device it shows the previous screen and this is displaying the toast messages. Both screen widgets have exactly the same code including the Toastr wrapping the Scaffold. Any ideas what is causing that? Thanks
from flutter_redux.
Related Issues (20)
- How to not accept change notifications when the Router is not at the top level, and then take the initiative to obtain the changes when the Router returns to the top level HOT 1
- onDidChange called twice HOT 8
- Is this package still actively maintained?
- `onWillChange` and `onDidChange` errors are swallowed HOT 4
- Warning related to `?` operator on Linux/Dev channel. HOT 2
- Import Store data type
- Widgets binding error after upgrading flutter version to 2.13.0-0.1.pre HOT 1
- onDidChange not working as expected HOT 3
- Build warning with Flutter 3.0 HOT 5
- flutter_redux depends on flutter_redux, version solving failed HOT 3
- onWillChange and onDidChange called twice after state update HOT 2
- Passing Store as an argument to MethodChannel and Background Isolate
- Question on how to use the reducer right way HOT 2
- [Question]: Any thoughts on difference between ignoreChange and distinct?
- Socket and Flutter_redux HOT 18
- Dispatching an action that does not alter state rerenders the widget, causing an infinite loop HOT 5
- How to watch redux store change inside useEffect? HOT 5
- [Question] is it expected that the store doesn't run until frames render? HOT 1
- After push a new page, and Dispatching an action, there is an infinite loop
- Is flutter redux actively maintained HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from flutter_redux.