如何在Blazor中设置页面标题? [英] How to set page title in blazor?

问题描述

由于Blazor是SPA框架，我想知道是否可以为Blazor中的每个页面设置页面标题吗?

As Blazor being a SPA framework, I would like to know is it possible to set a page title for each individual page in Blazor?

我目前正在Blazor Webassembly项目上工作，由于无法在SPA中找到一个index.html，因此无法找到一种添加页面标题的方法，但是如果可以实现设置，它将非常有用每个页面"的标题.

I am currently working on Blazor webassembly project and cannot figure out a way how to add a page title since there is only one index.html as it should be in SPA, but would be really useful if it can be achieved to set title for each "page".

推荐答案

1. 在index.html(或包含的.js文件)中提供以下脚本:

1. Provide following script in your index.html (or in an included .js file):

<script>
     setTitle = (title) => { document.title = title; };
</script>

1. 在每个页面中注入jsinterop:

1. In each page inject the jsinterop:

@inject IJSRuntime JSRuntime;

每次渲染后，将文档标题设置为您选择的值:

After each render, set the document title to the value of your choice:

@code
{
   protected override async Task OnAfterRenderAsync(bool firstRender)
   {
      await JSRuntime.InvokeVoidAsync("setTitle", "this is the new title"); ;        
   }    
}

这篇关于如何在Blazor中设置页面标题?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！