如何实现Blazor全局变量?

Question

我真正的问题是:我为web-app创建了帮助文档，我可以将它部署到其他域。在开发环境中，我使用本地主机，但在生产环境中，我使用真正的子域。

我有很多这样的页面

<DxToolbar>
<DxToolbarItem Text="New" Click="@OnAddNewClick" IconCssClass="grid-toolbar-new" />
<DxToolbarItem Text="Edit" Click="@OnEditClick" IconCssClass="grid-toolbar-edit" Enabled="@Enabled" />
<DxToolbarItem Text="Delete" Click="@OnDeleteClick" IconCssClass="grid-toolbar-delete" Enabled="@Enabled" />
<DxToolbarItem Text="Filter" Click="@OnShowFilterRow" IconCssClass="grid-toolbar-filter-row" />
<DxToolbarItem Text="Help" NavigateUrl="http://example.com/help/group1/feature001/" IconCssClass="grid-toolbar-document" target="_blank" />
<DxDataGridColumnChooserToolbarItem Text="Choose columns" Tooltip="Choose columns" />
</DxToolbar>

在其他页

<DxToolbarItem Text="Help" NavigateUrl="http://example.com/help/group1/feature003/" IconCssClass="grid-toolbar-document" target="_blank" />

和

<DxToolbarItem Text="Help" NavigateUrl="http://example.com/help/group2/feature005/" IconCssClass="grid-toolbar-document" target="_blank" />

我想用

@base_help_url//help/group1/feature001/
@base_help_url//help/group1/feature003/
@base_help_url//help/group2/feature005/

和如何/在哪里设置@base_help_url

如何实现这个想法?

Answer 1

步骤1。将@base_help_url存储在AppSettings文件中，然后在options类中可选地配置它。

//AppSettings.Development.json
{
"HelpUriBase": "..."
}

步骤2。创建一个接口IHelpUri，暴露一个方法string GetBaseUri();，然后在派生类中实现该接口。

public class HelpUri : IHelpUri
{
private readonly string _helpUriBase;
public HelpUri(IConfiguration configuration)
{
_helpUriBase = configuration.GetSection("HelpUriBase");
}
public string GetBaseUri => _helpUriBase;
}

步骤3。创建一个(Blazor)组件，包装DxToolbarItem组件，并具有[Parameter] string Path。

// HelpLink.razor
@inject IHelpUri HelpUri
<DxToolbarItem NavigateUrl="@Uri" />
@code {
[Parameter] public string Path { get; set; }
private string _helpUriBase;
protected string Uri => $"{_helpUriBase}/{Path}"
protected override async Task OnInitializedAsync()
{
_helpUriBase ??= HelpUri.GetBaseUri();
}

}

步骤4。当创建帮助链接时，使用helpink组件而不是DxToolbarItem组件。

<HelpLink Path="help/group1/feature001/" />
<HelpLink Path="help/group1/feature003/" />
<HelpLink Path="help/group2/feature005/" />