Open tnmhoang opened 1 month ago
import { Document, Font, PDFViewer, Page, StyleSheet, Text, View } from "@react-pdf/renderer"
import Normal from "./Times_New_Roman.ttf"; import { useCallback, useEffect, useState } from "react";
const PDF = () => { Font.clear(); Font.reset(); Font.register({ family: 'Times-New-Roman', src: Normal })
console.log('font register should have happened', Normal); console.log('registered getRegisteredFontFamilies', Font.getRegisteredFontFamilies()); console.log('registered getRegisteredFonts', Font.getRegisteredFonts())
const [isFontLoaded, setIsFontLoaded] = useState(false);
const loadFonts = useCallback(async () => { await Promise.all([ Font.load({ fontFamily: 'Times-New-Roman' }), ]); setIsFontLoaded(true); console.log(Font.getRegisteredFontFamilies()); console.log('fonts loaded'); }, []);
useEffect(() => { loadFonts(); }, [loadFonts]);
if (!isFontLoaded) { // tslint:disable-next-line:no-console console.log('isFontLoaded is FALSE'); return ( <></> ); } return (
) }
export default PDF;
const styles = StyleSheet.create({ page: { flexDirection: 'row', backgroundColor: '#E4E4E4' }, section: { margin: 10, padding: 10, flexGrow: 1 }, txt: { fontFamily: 'Times-New-Roman' } });
import { Document, Font, PDFViewer, Page, StyleSheet, Text, View } from "@react-pdf/renderer"
import Normal from "./Times_New_Roman.ttf"; import { useCallback, useEffect, useState } from "react";
const PDF = () => { Font.clear(); Font.reset(); Font.register({ family: 'Times-New-Roman', src: Normal })
console.log('font register should have happened', Normal); console.log('registered getRegisteredFontFamilies', Font.getRegisteredFontFamilies()); console.log('registered getRegisteredFonts', Font.getRegisteredFonts())
const [isFontLoaded, setIsFontLoaded] = useState(false);
const loadFonts = useCallback(async () => { await Promise.all([ Font.load({ fontFamily: 'Times-New-Roman' }), ]); setIsFontLoaded(true); console.log(Font.getRegisteredFontFamilies()); console.log('fonts loaded'); }, []);
useEffect(() => { loadFonts(); }, [loadFonts]);
if (!isFontLoaded) { // tslint:disable-next-line:no-console console.log('isFontLoaded is FALSE'); return ( <></> ); } return (
) }
export default PDF;
const styles = StyleSheet.create({ page: { flexDirection: 'row', backgroundColor: '#E4E4E4' }, section: { margin: 10, padding: 10, flexGrow: 1 }, txt: { fontFamily: 'Times-New-Roman' } });