В днешно време рамките са много мощни, за да поддържат някои изчисления и да намалят натоварването от страната на сървъра. Така че сега по-добре да заявите сървъри за изтегляне на файл, можете да изтеглите директно. Много пъти имаме изискване да изтегляме фактури, касови бележки или нещо друго в pdf формат. Така че можем да постигнем това, като просто конвертираме HTML в PDF.
Това може да се постигне само в 3 стъпки.
Стъпка 1:
Инсталирайте библиотеката с име jsPdf , тя дава няколко опции за генериране на pdf. Ще разгледаме само генератора на html към pdf.
npm i jspdf
Стъпка 2:
В родителския контейнер добавете свойството ref, наречено нещо, както следва:
ref е специален атрибут, подобен на атрибута key. Това ни позволява да получим директна препратка към конкретен DOM елемент или екземпляр на дъщерен компонент, след като е монтиран. Чрез атрибута ref ще имаме достъп до контейнера в метода на библиотеката jspdf, който ще разгледаме по-долу.
СТЪПКА 3:
Сега ще създадем функция с име изтеглянекоято ще бъде ударена, когато щракнем върху бутона. Функцията изтегляне съдържа следната дефиниция.
Други свойства като ширина, x, y биха задали съдържанието, ако искате съдържанието да бъде изтеглено с css, след това да конвертирате html в canvas, можете да разгледате опцията jsPdf на html2canvas за по-добро разбиране.
Сега най-накрая свържете функцията за изтегляне към бутона за изтегляне и готово!🍻 По този начин вашият html ще бъде изтеглен в pdf.
Заключение:
По този начин можете да изтеглите html в pdf в 3 малки стъпки. Това не е специфично само за vuejs, може да се използва с всяка друга рамка, само че методът за достъп до html ще се промени. Има много повече опции в jsPDF като html2canvas, ширина, височина и т.н., можете да ги разгледате в doc.
Можете да намерите кода в това репо и не се колебайте да добавите вашите мнения към него.
