فایل های PDF را در برنامه React خود بدون مشکل از طریق React-PDF نمایش دهید

شروع کار با React-PDF

توصیه و ساده ترین راه برای شروع نصب از طریق npm است، در زیر این دستور آمده است.

npm install react-pdf 

ارائه کاراکترهای غیر لاتین در JavaSrcipt API رایگان

کتابخانه React-PDF منبع باز به توسعه دهندگان نرم افزار این امکان را می دهد تا با استفاده از دستورات جاوا اسکریپت، کاراکترهای غیر لاتین را در برنامه خود به صورت برنامه نویسی ارائه دهند. React-PDF از کاراکترهای غیرلاتین نیز پشتیبانی می‌کند، و اگر می‌خواهید مطمئن شوید که کاراکترهای غیرلاتین به درستی هنگام نمایش PDF در یک پروژه رندر می‌شوند، می‌توانید با cMaps کپی شده از pdfjs-dist این کار را انجام دهید.

صفحات PDF یک یا چندگانه را با استفاده از API رایگان جاوا اسکریپت بارگیری کنید

تگ Document به شما این امکان را می دهد که یک سند PDF را که از طریق File prop منتقل می شود بارگذاری کنید. با استفاده از این تگ می توانید یک یا چند صفحه را بارگیری کنید یا ناوبری را نیز اضافه کنید. همچنین می‌توانید متن را در یک صفحه برجسته کنید، فهرست مطالب را به صورت تعاملی نشان دهید، و همچنین پیوندهای خارجی ارائه دهید.

import React from 'react';
import { Document, Page } from 'react-pdf';
import samplePDF from './test.pdf';
export default function Test() {
  return (
    
      
    
  );
}

مدیریت حاشیه نویسی در اسناد PDF از طریق جاوا اسکریپت

کتابخانه جاوا اسکریپت منبع باز React-PDF به برنامه نویسان نرم افزار این امکان را می دهد که به صورت برنامه نویسی انواع مختلف حاشیه نویسی را در اسناد PDF خود مدیریت کنند. لطفاً به یاد داشته باشید که کاربر باید برگه سبک لازم را برای نمایش صحیح حاشیه نویسی ها لحاظ کند. این به کاربران اجازه می دهد تا به راحتی، متن، جوهر، یادداشت، اشکال و موارد دیگر را برجسته کنند.

import React, { useState } from 'react';
import { Document, Outline, Page } from 'react-pdf';
import samplePDF from './test.pdf';
export default function Test() {
  const [pageNumber, setPageNumber] = useState(1);
  function onItemClick({ pageNumber: itemPageNumber }) {
    setPageNumber(itemPageNumber);
  }
  return (
    
      
    
  );
}