Persist Component State Tag Helper trong ASP.NET Core

Nguồn: Persist Component State Tag Helper in ASP.NET Core

Persist Component State Tag Helper (trình trợ giúp thẻ lưu trạng thái component) lưu trữ trạng thái của các Razor component (thành phần Razor) không thể định tuyến được render trong một trang hoặc view của ứng dụng Razor Pages hoặc MVC.

Điều kiện tiên quyết

Thực hiện theo hướng dẫn trong phần Use non-routable components in pages or views (Sử dụng component không thể định tuyến trong trang hoặc view) của bài viết Integrate ASP.NET Core Razor components with MVC or Razor Pages.

Lưu trữ trạng thái cho các component được prerender

Để lưu trữ trạng thái cho các component được prerender (kết xuất trước), hãy sử dụng Persist Component State Tag Helper (mã nguồn tham khảo). Thêm thẻ của Tag Helper, <persist-component-state />, bên trong thẻ đóng </body> của layout (bố cục) trong ứng dụng có prerender các component.

Các liên kết tài liệu đến mã nguồn tham khảo .NET thường tải nhánh mặc định của repository (kho lưu trữ), đại diện cho phát triển hiện tại cho phiên bản .NET tiếp theo. Để chọn một tag cho một phiên bản cụ thể, hãy sử dụng danh sách thả xuống Switch branches or tags.

Trong Pages/Shared/_Layout.cshtml cho các component được nhúng là WebAssembly prerendered (WebAssemblyPrerendered) hoặc server prerendered (ServerPrerendered):

cshtml

<body>
    ...

    <persist-component-state />
</body>

Quyết định trạng thái nào cần lưu trữ bằng cách sử dụng service (dịch vụ) PersistentComponentState. PersistentComponentState.RegisterOnPersisting đăng ký một callback (hàm gọi lại) để lưu trữ trạng thái component trước khi ứng dụng bị tạm dừng. Trạng thái được lấy lại khi ứng dụng tiếp tục.

Để biết thêm thông tin và ví dụ, xem ASP.NET Core Blazor prerendered state persistence.

Đối với ASP.NET Core 6.0 và 7.0

Để lưu trữ trạng thái cho các component được prerender, hãy sử dụng Persist Component State Tag Helper. Thêm thẻ của Tag Helper, <persist-component-state />, bên trong thẻ đóng </body> của trang _Host trong ứng dụng có prerender các component.

Trong Pages/_Host.cshtml của ứng dụng Blazor là WebAssembly prerendered (WebAssemblyPrerendered) trong ứng dụng Blazor WebAssembly được hosting hoặc ServerPrerendered trong ứng dụng Blazor Server:

cshtml

<body>
    ...

    <persist-component-state />
</body>

Quyết định trạng thái nào cần lưu trữ bằng cách sử dụng service PersistentComponentState. PersistentComponentState.RegisterOnPersisting đăng ký một callback để lưu trữ trạng thái component trước khi ứng dụng bị tạm dừng. Trạng thái được lấy lại khi ứng dụng tiếp tục.

Để biết thêm thông tin và ví dụ, xem Integrate ASP.NET Core Razor components with MVC or Razor Pages.