« Fluxor » : différence entre les versions

De Banane Atomic
Aller à la navigationAller à la recherche
(Page créée avec « Category:Blazor = Links = * [https://github.com/mrpmorris/Fluxor Github] * [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] = Installation = <kode lang='bash'> dotnet add package Fluxor.Blazor.Web </kode> <filebox fn='Program.cs'> builder.Services .AddFluxor(options => options.ScanAssemblies(typeof(Program).Assembly)); <... »)
 
 
(3 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 =
<filebox fn='Store/ItemSearchUseCase/ItemSearchCase.cs' collapsed>
[FeatureState]
public class TransactionsSearchState
{
    public string SearchText { get; } = string.Empty;
    public TransactionsSearchState(string searchText)
    {
        SearchText = searchText;
    }
    // Required for creating initial state
    private TransactionsSearchState()
    { }
}
</filebox>
<filebox fn='Store/ItemSearchUseCase/ItemSearchAction.cs' collapsed>
public class TransactionsSearchAction
{
    public string searchText { get; } = string.Empty;
    public TransactionsSearchAction(string searchText)
    {
        this.searchText = searchText;
    }
}
</filebox>
<filebox fn='Store/ItemSearchUseCase/Reducers.cs' collapsed>
public class Reducers
{
    [ReducerMethod]
    public static ItemSearchState ReduceTransactionsSearchAction(ItemSearchState state, ItemSearchAction action)
        => new(action.searchText);
}
</filebox>
<filebox fn='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));
</filebox>
<filebox fn='Pages/Items.razor'>
@inherits Fluxor.Blazor.Web.Components.FluxorComponent
</filebox>


= Installation =
= Installation =
Ligne 13 : 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

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

Bash.svg
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 />