动态页面中的 DOMPDF 重复元素答案

【问题标题】：DOMPDF repeat element in dynamic page动态页面中的 DOMPDF 重复元素
【发布时间】：2018-08-13 08:17:51
【问题描述】：

我正在使用 dompdf 生成报告。并尝试在页面中重复一个元素，根据数据，它最多可能需要 4 页。但它只在第一页创建

目前我有这个 html 标记。

<html>
  <head>
<style>
  @page { 
	margin: .5in;  
  }
  .footer{
	position:fixed;
	width:100%;
	bottom:60px;	
  }
  .page-3{
	position:relative;
  }
  .repeat{
	position:fixed;
	width:100%;
                top:10px;
  }
</style>
  </head>
  <body>		
	
<div class="page page-1">
  <div class="content">
	<div class="content-header">...</div>
	<div class="content-text">...</div>
  </div>
</div>

<div class="page page-2">
  <div class="content">
	<div class="content-header">...</div>
	<div class="content-text">...</div>
  </div>
</div>

<div class="page page-3">
  <div class="content">
	<div class="content-header repeat">
	  This must repeat in all pages generated
	</div>
	<div class="content-text">
	  atleast 2~4 pages
	</div>
  </div>
</div>

<div class="page page-4">
  <div class="content">
	<div class="content-header">...</div>
	<div class="content-text">...</div>
  </div>
</div>

<div class="footer">
  footer
</div>
	
  </body>
</html>

假设.page-3 生成了 3 个页面。但是.repeat 只在.page-3 内部的第一页上看到

我尝试为.page-3 使用背景图片，但它仍然相同，并且只显示在第一个生成的页面上。

我使用的是 0.8.2 版本的 dompdf。

【问题讨论】：

标签： dompdf

【解决方案1】：

如果有人遇到和我一样的问题。我最终使用了page_script。

因为我知道前两页是静态的，最后一页是静态的，所以我访问了$PAGE_NUM 并设置了这样的条件

    $pdf->page_script('
            if( $PAGE_NUM != 1 ){ // 1st page has no header
                $text = "";
                if( $PAGE_NUM == 2 ){
                    $text = "This is 2nd page";
                }else if( $PAGE_NUM > 2 && $PAGE_NUM < $PAGE_COUNT ){
                    $text = "This is the page 3 until before the last page";
                }else if( $PAGE_NUM == $PAGE_COUNT ){
                    $text = "This is last page";
                }

                // setup postioning, color, size etc for design     

                // use $text as header text                 
                $pdf->text( $posX, $posY, $text, $font, $size, $color);
            }

    ');

并删除了 HTML 标记中的所有 <div class="content-header">...</div>

【讨论】：