Skip to content

Commit cb0b028

Browse files
dodygdodyg
committed
Add sample for razor component section
1 parent 15a0626 commit cb0b028

File tree

7 files changed

+75
-4
lines changed

7 files changed

+75
-4
lines changed

‎README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
# Samples for ASP.NET Core 6.0 (468)
1+
# Samples for ASP.NET Core 6.0 (469)
22

3-
Samples for ASP.NET Core **8.0 Preview 3** is available [here](/projects/.net8) (6).
3+
Samples for ASP.NET Core **8.0 Preview 3** is available [here](/projects/.net8) (7).
44

55
Samples for ASP.NET Core **7.0** is available [here](/projects/.net7) (45).
66

‎projects/.net8/README.md

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# ASP.NET 8.0 Preview 3 (6)
1+
# ASP.NET 8.0 Preview 3 (7)
22

33
These samples require [.NET 8.0 Preview 3](https://github.com/dotnet/aspnetcore/blob/main/docs/DailyBuilds.md). You will have to install the daily build since Preview 3 is not officially released yet.
44

@@ -25,4 +25,8 @@ These samples require [.NET 8.0 Preview 3](https://github.com/dotnet/aspnetcore/
2525

2626
* [RazorComponentFive](RazorComponentFive)
2727

28-
This sample demonstrates rendering a Razor Component from a MVC Controller via `RazorComponentResult` and passing data via a dictionary.
28+
This sample demonstrates rendering a Razor Component from a MVC Controller via `RazorComponentResult` and passing data via a dictionary.
29+
30+
* [RazorComponentSix](RazorComponentSix)
31+
32+
This sample demonstrates the new section functionality using `SectionOutlet` to mark a section and `SectionContent` to supply the content to a section.

‎projects/.net8/RazorComponentSix/Pages/Greetings.razor

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
@layout RazorComponentSix.Shared.MainLayout
2+
3+
<h1>@Message</h1>
4+
5+
<Microsoft.AspNetCore.Components.Sections.SectionContent SectionName="sidebar" >
6+
This is a section @Date
7+
</Microsoft.AspNetCore.Components.Sections.SectionContent>
8+
9+
@code{
10+
11+
[Parameter]
12+
public string Message { get; set; }
13+
14+
[Parameter]
15+
public DateOnly Date { get; set; }
16+
}

‎projects/.net8/RazorComponentSix/Program.cs

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
using Microsoft.AspNetCore.Components.Endpoints;
3+
4+
var builder = WebApplication.CreateBuilder();
5+
builder.Services.AddRazorComponents();
6+
builder.Services.AddMvc();
7+
var app = builder.Build();
8+
9+
app.MapControllers();
10+
11+
app.Run();
12+
13+
public class HomeController : Controller
14+
{
15+
[Route("/")]
16+
public IResult Index() => new RazorComponentResult<RazorComponentSix.Pages.Greetings>(new { Message = "Hello World too", Date = DateOnly.FromDateTime(DateTime.Now) });
17+
}
18+

‎projects/.net8/RazorComponentSix/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# Razor Component Section
2+
3+
This sample demonstrates the new section functionality in Razor Component. Use `SectionOutlet` to render a section in a component. Use `SectionContent` to supply the content for the section.

‎projects/.net8/RazorComponentSix/RazorComponentSix.csproj

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<Project Sdk="Microsoft.NET.Sdk.Web">
2+
<PropertyGroup>
3+
<TargetFramework>net8.0</TargetFramework>
4+
<ImplicitUsings>true</ImplicitUsings>
5+
</PropertyGroup>
6+
</Project>

‎projects/.net8/RazorComponentSix/Shared/MainLayout.razor

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
@inherits LayoutComponentBase
2+
3+
<!doctype html>
4+
<html lang="en">
5+
<head>
6+
<meta charset="utf-8">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<title>Blazor United</title>
9+
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-aFq/bzH65dt+w6FI2ooMVUpc+21e0SRygnTpmBvdBgSdnuTN7QbdgL+OapgHtvPp" crossorigin="anonymous">
10+
</head>
11+
<body>
12+
<div class="container">
13+
<div class="row">
14+
<div class="col-md-6">
15+
@Body
16+
</div>
17+
<div class="col-md-6">
18+
<Microsoft.AspNetCore.Components.Sections.SectionOutlet SectionName="sidebar" />
19+
</div>
20+
</div>
21+
</div>
22+
23+
</body>
24+
</html>

0 commit comments

Comments
 (0)