« Fluxor » : différence entre les versions
De Banane Atomic
Aller à la navigationAller à la recherche
Aucun résumé des modifications |
(→Links) |
||
| (2 versions intermédiaires par le même utilisateur non affichées) | |||
| Ligne 4 : | Ligne 4 : | ||
* [https://github.com/mrpmorris/Fluxor/blob/master/Docs/README.md Documentation] | * [https://github.com/mrpmorris/Fluxor/blob/master/Docs/README.md Documentation] | ||
* [https://blog.antosubash.com/posts/state-management-blazor-fluxor Blazor state management with Fluxor] | * [https://blog.antosubash.com/posts/state-management-blazor-fluxor Blazor state management with Fluxor] | ||
* [https://dev.to/mr_eking/advanced-blazor-state-management-using-fluxor-part-5-14j2 Advanced Blazor State Management Using Fluxor - EditForm Binding] | |||
= Example = | = Example = | ||
| Ligne 45 : | Ligne 46 : | ||
<filebox fn='Pages/Items.razor.cs'> | <filebox fn='Pages/Items.razor.cs'> | ||
[Inject] | public partial class Items : FluxorComponent | ||
private IState<ItemSearchState> ItemSearchState { get; set; } | { | ||
[Inject] | |||
private IState<ItemSearchState> ItemSearchState { get; set; } | |||
[Inject] | [Inject] | ||
public IDispatcher Dispatcher { get; set; } | public IDispatcher Dispatcher { get; set; } | ||
// get the state | // get the state | ||
ItemSearchState.Value.SearchText | ItemSearchState.Value.SearchText | ||
// update the state | |||
Dispatcher.Dispatch(new ItemSearchAction(searchText)); | |||
</filebox> | |||
/ | <filebox fn='Pages/Items.razor'> | ||
@inherits Fluxor.Blazor.Web.Components.FluxorComponent | |||
</filebox> | </filebox> | ||
| Ligne 66 : | Ligne 73 : | ||
builder.Services | builder.Services | ||
.AddFluxor(options => options.ScanAssemblies(typeof(Program).Assembly)); | .AddFluxor(options => options.ScanAssemblies(typeof(Program).Assembly)); | ||
// options.UseReduxDevTools(); | |||
</filebox> | </filebox> | ||
Dernière version du 23 août 2023 à 11:10
Links
- Github
- Documentation
- Blazor state management with Fluxor
- Advanced Blazor State Management Using Fluxor - EditForm Binding
Example
| Store/ItemSearchUseCase/ItemSearchCase.cs |
[FeatureState]
public class TransactionsSearchState
{
public string SearchText { get; } = string.Empty;
public TransactionsSearchState(string searchText)
{
SearchText = searchText;
}
// Required for creating initial state
private TransactionsSearchState()
{ }
}
|
| Store/ItemSearchUseCase/ItemSearchAction.cs |
public class TransactionsSearchAction
{
public string searchText { get; } = string.Empty;
public TransactionsSearchAction(string searchText)
{
this.searchText = searchText;
}
}
|
| Store/ItemSearchUseCase/Reducers.cs |
public class Reducers
{
[ReducerMethod]
public static ItemSearchState ReduceTransactionsSearchAction(ItemSearchState state, ItemSearchAction action)
=> new(action.searchText);
}
|
| Pages/Items.razor.cs |
public partial class Items : FluxorComponent
{
[Inject]
private IState<ItemSearchState> ItemSearchState { get; set; }
[Inject]
public IDispatcher Dispatcher { get; set; }
// get the state
ItemSearchState.Value.SearchText
// update the state
Dispatcher.Dispatch(new ItemSearchAction(searchText));
|
| Pages/Items.razor |
@inherits Fluxor.Blazor.Web.Components.FluxorComponent |
Installation
|
dotnet add package Fluxor.Blazor.Web |
| Program.cs |
builder.Services
.AddFluxor(options => options.ScanAssemblies(typeof(Program).Assembly));
// options.UseReduxDevTools();
|
| App.razor |
<Fluxor.Blazor.Web.StoreInitializer /> |
