在Blazor项目中使用ABP模块定义的特性

背景

上文为Wms模块定义了4个功能，本文演示在Blazor界面上如何控制用户是否能使用其中的一个功能。

步骤

1、在“Ami.Wms.Common.Blazor”中创建“Containers”文件夹

2、创建“WmsContainer.razor”

@using Volo.Abp.Features
@inject IFeatureChecker FeatureChecker
@using Ami.Wms.Common.Features
@inherits ComponentBase

@if (this._isWmsEnabled.HasValue && this._isWmsEnabled.Value)
{
    <CascadingValue Name="@WmsFeature.IsEnabled" Value="@this._isWmsEnabled.Value">
        @this.ChildContent
    </CascadingValue>
}
else
{
    <div>您不能使用仓储模块，请联系客服开通。</div>
}

@code {

    [Parameter]
    public RenderFragment? ChildContent { get; set; }

    bool? _isWmsEnabled;

    bool IsInitialized;

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();

        if (!this.IsInitialized)
        {
            this._isWmsEnabled = await this.FeatureChecker.IsEnabledAsync(WmsFeature.IsEnabled);
        }

        this.IsInitialized = true;
    }
}

3、修改“Ami.Wms.Common.Blazor”的“Pages”目录下“Common"中的Index.razor

@page "/Common"
@using Microsoft.Extensions.Localization
@using global::Ami.Wms.Common.Localization
@using Ami.Wms.Common.Blazor.Containers
@inject IStringLocalizer<CommonResource> L
@{
}

<WmsContainer>
    <h1>Common</h1>
    <p>@L["SamplePageMessage"]</p>
</WmsContainer>

预览效果

1、启动Blazor.Server.Host

2、不授予仓储的功能

在“管理主机功能”这里反选：

3、再次回到/common

后记

查看本文用到的代码请访问：
Gitee.com

下一篇我们把另外3个功能都加上。

在本文是管理“主机”功能，也就是针对localhost站点。过几篇文章，我会给您介绍“租户”的概念，然后您才能完整理解“功能/特性”的意义。