时间戳

首页 > 解决方案 > Fluxor Blazor 如何保存列表？

c# - Fluxor Blazor 如何保存列表？

问题描述

我正在开发一个 Blazor 应用程序，在这个应用程序中，我需要存储用户选择项列表的状态。当用户按下“保存更改”按钮时，我想将列表存储在状态中。

到目前为止，我已经编写了 Fluxor 文档中的四个强制性类：

服务状态：

public record ServiceState
{
    public List<ServiceModel> SelectedService { get; init; }
}

服务特色

public override string GetName() => nameof(ServiceState);


    protected override ServiceState GetInitialState() 
    {
        return new ServiceState
        {
            SelectedService = new List<ServiceModel>()
        };
    }

选择服务操作：

public class SelectServiceAction
{
    public List<ServiceModel> _serviceList;

    public SelectServiceAction(List<ServiceModel> choosenServices)
    {
        _serviceList = choosenServices;
    }
}

和 SelectServiceReducer：

public class SelectServiceReducer
{
    [ReducerMethod]
    public static ServiceState OnSelectService(ServiceState state, SelectServiceAction action) 
    {

        return state with
        {
            SelectedService = action._serviceList
        };
    }
    
}

我已经尝试了很多东西，但似乎没有任何效果存储在状态中的列表总是空的，但有趣的是在 SelectServiceAction 类中：

public SelectServiceAction(List<ServiceModel> choosenServices)
{
    _serviceList = choosenServices;
}

如果我在最后一个 } _serviceList 中放置了一个断点，则正确地包含了我传递给调度程序的列表中包含的所有项目。似乎问题出在 ServiceState 本身，

你碰巧知道我做错了什么吗？如果您需要我显示更多代码，我会发布它，我提前感谢您。

标签： c#asp.netblazor-server-sidestate-managementfluxor

解决方案

我找到了一种方法来做到这一点。我不知道这是否是最好的方法，但我们来了。

您的 SelectServiceAction 应该在构造函数中有一个 ServiceModel。我还更改了您的方法的名称。我认为将动词放在方法名称中很好，因为您也可能会删除。

public class SelectServiceAddAction 
{
    public ServiceModel _service {get; set; }
    public SelectServiceAddAction(ServiceModel service)
     {
         _service = service;
     }
}

然后在你的减速器中调用该方法。

public static class SelectServiceReducer
{ 
     [ReducerMethod]
     public static ServiceState OnSelectService(ServiceState state, SelectServiceAddAction action)
     {
       var SelectedService = state.SelectedService;
       SelectedService.Add(action._service);
       return state with 
       {
         SelectedService = SelectedService
       };
     }
}

还可以考虑将“SelectedService”更改为涉及状态的名称，例如“CurrentSelectedServices”希望这会有所帮助！

推荐阅读