Study Blazor .NET(八)页面布局

翻译自:Study Blazor .NET,转载请注明。

页面布局

在模板代码中,使用 bootstrap CSS 页面布局,在 NavMenu 组件中路由指向的 MainLayout 组件里,相应的组件在 @Body div元素中渲染。

Navlink 是blazor内置组件,它使用 href 特性提供组件列表的路由。

//MainLayout.razor
@inherits LayoutComponentBase
<div>
    <NavMenu />
</div>
<div >
    @Body   
</div>
///NavMenu.razor
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">
   Home
</NavLink>
<NavLink class="nav-link" href="counter">
   Counter
</NavLink>
<NavLink class="nav-link" href="fetchdata">
   Fetch data
</NavLink>
上一篇:NET6 Razor学习


下一篇:元注解:@Retention 在hbase中用于获取确定高优先级的RPC操作