我正在尝试设置一个导航,其中链接由
appsettings.json
值设置。也许有更好的方法可以在没有 JavaScript 的情况下做到这一点?
这是我的组件,名为
Navigation.razor
@inject IConfiguration Configuration
@inject IJSRuntime JSRuntime
<a id="test-link">Test</a>
<script>
function SetNavlinks(url){
var a = document.getElementById('test-link')
a.setAttribute("href", url);
}
</script>
@code{
protected override async Task OnInitializedAsync()
{
await InitializeNavigation();
InvokeAsync(StateHasChanged);
}
Task InitializeNavigation(){
var testLinkURL = Configuration.GetValue<string>("ContentURLs:Values:TestLink");
JSRuntime.InvokeVoidAsync("SetNavlinks", testLinkURL);
return Task.CompletedTask;
}
}
问题是页面加载后 DOM 看起来像这样:
<a id="test-link">Test</a>
但是如果在开发控制台中使用
document.getElementById('test-link')
,它会显示:
<a href="https://itworks.com" id="test-link">Test</a>
您不需要任何 JavaScript 来完成此操作。您可以在初始化时设置 url 的值。
<a href="@_url" id="test-link">Test</a>
@code{
private string _url;
protected override void OnInitialized()
{
_url = Configuration.GetValue<string>("ContentURLs:Values:TestLink");
}
}