我正在開發 Blazor 伺服器專案。要求之一是在彈出視窗中顯示記錄，然後將其列印為 PDF 文件。如果記錄太多而無法容納在一頁上，PDF 將僅儲存為單頁。我的意思是只有幾筆記錄適合顯示在 PDF 的第一頁。如何讓PDF顯示所有記錄？ 是CSS的原因嗎？
這裡是模態：
@page "/dialogcard/{Order}"
@using IMS.CoreBusiness
@using IMS.UseCases.Interfaces.OrderDetail
@using System.Globalization
@inject IViewOrderDetailsByOrderIdUseCase ViewOrderDetailsByOrderIdUseCase
@inject DialogService DialogService
@inject IJSRuntime JsRuntime
<style>
.rz-dialog-wrapper {
left:0;
}
/*.rz-card{
margin-top: -1.9rem !important;
}*/
.rz-dialog-content {
margin-top: -55px;
}
</style>
@if (orderDetails != null)
{
<div id="printarea1">
<div class="row my-4">
<div class="col-md-12">
<RadzenCard>
<h3 class="h5">
Order Date: @Order.OrderDateTime
</h3>
<RadzenTabs>
<Tabs>
@{
var detailVendorId = 0;
}
@foreach (var detail in orderDetails)
{
@if (detailVendorId != detail.VendorId)
{
<RadzenTabsItem Text="@detail.Vendor.Name">
<div class="row">
<div class="col-lg-6 d-flex">
<RadzenCard Style="width: 100%; overflow: hidden;">
<h3 class="h5">Contact</h3>
<div class="d-flex flex-row">
<div>
<div>Company</div>
<b>Vorlance</b>
<div class="mt-3">Responsible</div>
<b>@detail.Order.DoneBy</b>
<div class="mt-3">Vendor</div>
<b>@detail?.Vendor.Name</b>
這是模式的螢幕截圖：
這是列印預覽：
這是相關的CSS：
@media print {
body * {
visibility: hidden;
}
#printarea1, #printarea1 *{
visibility: visible;
}
#printarea, #printarea * {
visibility: visible;
}
.rz-tabview-nav li:not(.rz-tabview-selected) {
display: none;
}
#printarea1 {
position: fixed;
left: 0;
頂: 170px;
}
#printarea {
position: fixed;
left: 15px;
top: 0;
}
button[type=button], input[type=text] {
display: none;
}
.rz-data-grid {
height: unset!important;
}
}
編輯 1
#我研究了一下，像這樣改變了CSS，但仍然是一頁:(
.rz-data-grid {
height: auto !important;
overflow: visible !important;
page-break-after: always;
}
瀏覽器預設使用A4作為頁面尺寸選項來列印頁面，為了適應頁面尺寸，瀏覽器列印預覽會自動隱藏溢出的內容。因此，具有大量列的資料網格將被剪掉以適應列印頁面的大小。
要列印大量列，請根據內容大小調整列印選項面板中的縮放選項。
當資料格包含大量資料時，考慮到瀏覽器效能，一次列印所有資料並不是最佳選擇。因為在單一頁面中渲染所有 DOM 元素會在瀏覽器中產生效能問題。這會導致瀏覽器速度變慢或無回應。 DataGrid 可以選擇透過虛擬化處理大量資料。但是，在列印時，無法對行和列使用虛擬化。
如果仍然需要列印所有數據，我們建議您將數據網格匯出到 Excel 或 CSV 或 Pdf 文件，然後從另一個非基於 Web 的應用程式進行列印。
產生PDF的方法和函式庫有很多，像是syncfusion等