#html #css #reactjs #printing #reactstrap
#HTML #CSS #реагирует на #печатание #реагирующий ремень
Вопрос:
Я пытаюсь составить отчет с номерами страниц. Моя таблица слишком велика и разбита на множество страниц.
Мне нужен номер страницы, чтобы он отображался во всех документах. Thead повторяется на каждой странице, и это именно то, что мне нужно, но обратное приращение не работает и всегда показывает «1».
Я использую Reactstrap.
Это мой код:
lt;div id="printMe" gt; lt;Table size="sm" borderedgt; lt;theadgt; lt;tr style={{ borderTop: "solid" }}gt; lt;th colSpan="2"gt;Companys Namelt;/thgt; lt;th colSpan="1"gt;lt;div className="pageNumber"gt;Sheet lt;/divgt;lt;/thgt; lt;/trgt; lt;tr style={{ borderBottom: "solid" }}gt; lt;th colSpan="2"gt;Statuslt;/thgt; lt;th colSpan="1"gt;Datelt;/thgt; lt;/trgt; lt;trgt; lt;thgt;Codelt;/thgt; lt;thgt;Namelt;/thgt; lt;thgt;Detailslt;/thgt; lt;/trgt; lt;/theadgt; lt;tbodygt; {data.map(est =gt; lt;trgt; lt;tdgt;{est.code}lt;/tdgt; lt;tdgt;{est.name}lt;/tdgt; lt;tdgt;{est.details}lt;/tdgt; lt;/trgt; )} lt;/tbodygt; lt;/Tablegt; lt;/divgt;
И это CSS:
@media print{ @page { margin: ${marginTop} ${marginRight} ${marginBottom} ${marginLeft} !important; } body{ counter-reset: section; } .pageNumber { counter-increment: section; } .pageNumber::after{ content:counter(section); } }