You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
[`ReactterContext`](https://pub.dev/documentation/reactter/latest/core/ReactterContext-class.html) is a abstract class that allows to manages [`ReactterHook`](https://pub.dev/documentation/reactter/latest/core/ReactterHook-class.html) and provides life-cycle events.
186
183
187
-
In flutter, using [`ReactterProvider`](https://pub.dev/documentation/flutter_reactter/latest/widgets/ReactterProvider-class.html), it's a way to share the state between widgets without having to explicitly pass a prop through every level of the tree.
188
-
189
184
You can use it's functionalities, creating a class that extends it:
190
185
191
186
```dart
192
187
class AppContext extends ReactterContext {}
193
188
```
194
189
190
+
You can use the [shortcuts to manage instances](#shortcuts-to-manage-instances) or [using `UseContext` hook](#using-usecontext-hook) to access it.
191
+
195
192
> **RECOMMENDED:**
196
193
> Name class with `Context` suffix, for easy locatily.
197
194
195
+
> **NOTE:**
196
+
> In flutter, using [`ReactterProvider`](https://pub.dev/documentation/flutter_reactter/latest/widgets/ReactterProvider-class.html), it's a way to share the state between widgets without having to explicitly pass a property through every level of the tree.
197
+
198
198
### Lifecycle of `ReactterContext`
199
199
200
200
`ReactterContext` has the following [Lifecycle](https://pub.dev/documentation/reactter/latest/core/Lifecycle.html) events:
@@ -217,20 +217,7 @@ class AppContext extends ReactterContext {}
217
217
218
218
- **`Lifecycle.destroyed`**: Event when the instance did be destroyed by `ReactterInstanceManager`.
219
219
220
-
You can put it on listen, using `Reactter.on` or `UseEvent<T>().on`, for example:
You can use the [shortcuts](#shortcuts-to-manage-events) or [`UseEvent` hook](#using-useevent-hook) to listen to these events.
234
221
235
222
### Shortcuts to manage instances
236
223
@@ -353,7 +340,7 @@ class AppContext extends ReactterContext {
353
340
354
341
> **NOTE:** If you're not sure that you got the instance from the beginning, you need to use the `UseEffect` as shown in the example above.
355
342
>
356
-
> **NOTE:** The context that you need to get, must be created by [`ReactterInstanceManager`](https://pub.dev/documentation/reactter/latest/core/ReactterInstanceManager-class.html).
343
+
> **NOTE:** The context that you need to get, must be created by [`ReactterInstanceManager`](https://pub.dev/documentation/reactter/latest/core/ReactterInstanceManager-mixin.html).
[`Signal`](https://pub.dev/documentation/reactter/latest/core/Signal-class.html) is a class that store a `value` of any type and notify the listeners when the `value` is updated.
400
387
401
-
In flutter, using [`ReactterWatcher`](https://pub.dev/documentation/flutter_reactter/latest/widgets/ReactterWatcher-class.html), it's a way to keep the widgets automatically updates, accessing the value of signal reactively.
388
+
> **NOTE:**
389
+
> In flutter, using [`ReactterWatcher`](https://pub.dev/documentation/flutter_reactter/latest/widgets/ReactterWatcher-class.html), it's a way to keep the widgets automatically updates, accessing the value of signal reactively.
402
390
403
391
You can create a new `Signal`, like so:
404
392
@@ -454,7 +442,7 @@ userSignal.refresh();
454
442
When `value` is changed, the `Signal` will emitted the following events:
455
443
456
444
-`Lifecycle.willUpdate` event is triggered before the `value` change or `update`, `refresh` methods have been invoked.
457
-
-`Lifecicle.didUpdate` is triggered after the `value` change or `update`, `refresh` methods have been invoked.
445
+
-`Lifecicle.didUpdate`event is triggered after the `value` change or `update`, `refresh` methods have been invoked.
458
446
459
447
> **NOTE:**
460
448
> When you do any arithmetic operation between two `Signal`s, its return a `Obj`, for example: `1.signal + 2.signal` return `3.obj`.
@@ -521,7 +509,7 @@ userState.refresh();
521
509
When `value` is changed, the `UseState` will emitted the following events:
522
510
523
511
-`Lifecycle.willUpdate` event is triggered before the `value` change or `update`, `refresh` methods have been invoked.
524
-
-`Lifecicle.didUpdate` is triggered after the `value` change or `update`, `refresh` methods have been invoked.
512
+
-`Lifecicle.didUpdate`event is triggered after the `value` change or `update`, `refresh` methods have been invoked.
525
513
526
514
### Different between `UseState` and `Signal`
527
515
@@ -531,15 +519,15 @@ Both `UseState` and `Signal` represent a state(`ReactterState`). But there are a
531
519
532
520
With `UseState` is necessary use `value` property every time for read or write its state. But with `Signal` it is not necessary, improving code readability.
533
521
534
-
In Flutter, to use `UseState` you need to provide its `ReactterContext` to the Widget tree,with `ReactterProvider` or `ReactterComponent` and access it through of `BuildContext`. With `Signal` use `ReactterWatcher` only, it's very simple.
522
+
In Flutter, to use `UseState` you need to provide its `ReactterContext` to the Widget tree,with `ReactterProvider` or `ReactterComponent` and access it through of `BuildContext`. With `Signal` use `ReactterWatcher` only, it's very simple.
535
523
536
524
But it is not all advantages for `Signal`, although it is good for global states and for improving code readability, it is prone to antipatterns and makes debugging difficult(This will be improved in the following versions).
537
525
538
526
The decision between which one to use is yours. You can use one or both without them getting in the way. And you can even replace a `UseState` with a `Signal` into a `ReactterContext`.
539
527
540
528
### Using `UseAsyncState` hook
541
529
542
-
[`UseAsyncState`](https://pub.dev/documentation/reactter/latest/reactter/UseAsyncState-class.html) is a `ReactterHook` with the same functionality as `UseState` but provides a `asyncValue` method, which will be obtained when `resolve` method is executed.
530
+
[`UseAsyncState`](https://pub.dev/documentation/reactter/latest/hooks/UseAsyncState-class.html) is a `ReactterHook` with the same functionality as `UseState` but provides a `asyncValue` method, which will be obtained when `resolve` method is executed.
543
531
544
532
```dart
545
533
class TranslateArgs {
@@ -594,7 +582,7 @@ final valueComputed = asyncState.when<String>(
594
582
595
583
### Using `UseReducer` hook
596
584
597
-
[`UseReducer`](https://pub.dev/documentation/reactter/latest/core/UseReducer-class.html) is a `ReactterHook` that manages state using reducer method. An alternative to `UseState`.
585
+
[`UseReducer`](https://pub.dev/documentation/reactter/latest/hooks/UseReducer-class.html) is a `ReactterHook` that manages state using reducer method. An alternative to `UseState`.
598
586
599
587
> **RECOMMENDED:**
600
588
> `UseReducer` is usually preferable to `UseState` when you have complex state logic that involves multiple sub-values or when the next state depends on the previous one.
@@ -706,7 +694,7 @@ class AppContext extends ReactterContext {
706
694
);
707
695
708
696
return () {
709
-
// Cleanup - Execute Before count state changed or 'willUnmount' event
697
+
// Cleanup - Execute before count state changed or 'willUnmount' event
710
698
print("Cleanup executed");
711
699
};
712
700
}, [count], this);
@@ -969,6 +957,7 @@ class CounterComponent extends ReactterComponent<AppContext> {
0 commit comments