mobx_hooks

Description:

mobx hooks

Mobx Hooks #
Flutter Hooks for Mobx. This package attemp to bring Flutter Hooks for Mobx
Motivation & Inspiration : #
The motivation for this project started when I wanted to migrate an old project of mine from Mobx to Riverpod and Flutter Hooks. But as much as I enjoyed using Riverpod and Flutter Hooks, I missed the ease of use of Mobx. So as I looked for something that combines both, but I couldn't find any.
Inspirations :
This package was inspired and uses the following packages as dependecnies

Flutter Hooks by Remi Ressoulet
MobX

Getting Started : #
Just add the dependency to mobx_hooks in your pubspec.yaml :
dependecies:
mobx_hooks: latest
copied to clipboard
Example : #
If you're familiar with MobX and Flutter Hooks, using MobX Hooks is very easy. Here is an example using a counter :
class Counter {
Counter() {
increment = Action(_increment);
}

final count = Observable(0);

Action increment;

void _increment() {
_value.value++;
}
}

final counter = Counter();

class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'MobX Hooks',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(),
);
}
}

class MyHomePage extends HookWidget {
const MyHomePage();

@override
Widget build(BuildContext context) {
final count = useObservable(counter.count);
return Scaffold(
appBar: AppBar(
title: Text('MobX Counter'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
'${count.value}',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: counter.increment,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
copied to clipboard
Hooks : #
This is the initial list of Hooks available in this package. More are coming soon.



Name
Description




useObservable
Subscribes to an Observable and return it's value


useCompute
Creates a Mobx Computed from the result of a function


useComputed
Subscribes to the value of a Computed