ReactからPDFを作成するには？

私はReact.JSでjsPDFライブラリを使用するつもりですが、エラーが発生しました。誰かが私の質問を受け取ったら教えてください。私は2日以上これを試していたが、私はできない。ReactからPDFを作成するには？

2016-10-04 Zhao.YM

はい、使用しているサンプルコードをアップロードできます。 –

あなたは何を試しましたか？どのようなエラー？ –

解決しました。 –

ステップ1：

Package.json 依存関係 "jspdf"： "gitの：//github.com/MrRio/jsPDF/#76edb3387cda3d5292e212765134b06150030364"、これが動作していないNPMのためjspdfによるものです。

ステップ2：

は

onPrint() { 
    const { vehicleData } = this.props.parkedVehicle; 
    const { 


    plate_no, 
     max_time, 
     entry_date_time, 
     exit_date_time, 
     expiry_time, 
     address1, 
     address2, 
     city, 
     state, 
     zip, 
     country, 
     parking_status 
    } = vehicleData; 

    var pdfConverter = require('jspdf'); 
    //var converter = new pdfConverter(); 
    //var doc = converter.jsPDF('p', 'pt'); 

    var doc = new pdfConverter('p','pt','c6'); 

    doc.setFontSize(22); 
    doc.text(20, 50, 'Park Entry Ticket'); 
    doc.setFontSize(16); 
    doc.text(20, 80, 'Address1: ' + address1); 
    doc.text(20, 100, 'Address2: ' + address2); 
    doc.text(20, 120, 'Entry Date & time: ' + entry_date_time); 
    doc.text(20, 140, 'Expiry date & time: ' + exit_date_time); 
    doc.save("test.pdf"); 
}

印刷機能を追加し、それは私にはうまく働きました。

出典

2016-10-04 09:48:08 Angel

これはあなたの側で動作しますか、ここでは完璧に動作します –

npm install jspdfは今すぐうまくいくようです.. –

また、Reactコンポーネントをpdfに直接変換することもできます。

考え方は、以下の変換により反応し、レンダリング渡すことです： DOM - > CANVAS - > PNG - > PDF

キャンバスにDOMのために、我々はhtml2canvasライブラリを使用することができます。 PNGへのキャンバスはまっすぐです。 PNGからPDFまで、jsDomを使用できます。

私は詳細とコードサンプルhereで説明した回答を掲載しました。

出典

2017-07-10 16:31:21

このリンクは質問に答えるかもしれませんが、答えの本質的な部分をここに含めて参考にしてください。リンクされたページが変更された場合、リンクのみの回答は無効になります。 - [レビューから]（/レビュー/低品質の投稿/ 16668690） – g00glen00b

私は詳細を持って答えを更新しました。 –

ReactからPDFを作成するには？

答えて

関連する問題