asp.net blazor集成ReactiveUI.Blazor

net blazor集成ReactiveUI.Blazor"/>

asp.net blazor集成ReactiveUI.Blazor

asp blazor项目添加Nuget包ReactiveUI和ReactiveUI.Blazor

创建视图模型BlogPostViewModel继承自ReactiveObject

    public class BlogPostViewModel : ReactiveObject{private readonly AnonymousBlogClient _http;public List<BlogCategory> Categories { get; set; }public BlogPost BlogPost { get; set; }public BlogPostViewModel(AnonymousBlogClient http){_http = http;}public async Task Setup(string id){try{BlogPost = await _http.GetBlogPostAsync(id);if (BlogPost == null) return;Categories = (await _http.GetCategoriesAsync())?.ToList();}catch (Exception ex){Console.WriteLine(ex);}}}

添加根服务类的依赖注入

builder.Services.AddScoped<BlogPostViewModel>();

BlogPostView.razor中添加继承

@inherits ReactiveComponentBase<BlogPostViewModel>

blazor页面中添加代码

[Parameter] public string id { get; set; }
[Inject]
public BlogPostViewModel BlogPostViewModel
{get => ViewModel;set => ViewModel = value;
}

完成