#html #reactjs #typescript
Вопрос:
У меня есть следующая функция, и я хочу иметь возможность преобразовать список в элемент опроса, который вы бы спросили меня, почему ? Я использую компонент mui , и у них демонстративно возникают проблемы с тем, что касается стиля, если он отображается непосредственно из dom по какой-то причине, в качестве альтернативы я хочу визуализировать их отдельно и создать необходимый холст, чтобы я мог применить стиль css, который может быть более совместим с библиотекой h2c. Что вы думаете об этом подходе в целом, я пытаюсь визуализировать внутри с div, установленным на скрытый, отображение ни для кого, но рендеринг вышел искаженным…
const html2canvasFn = () =gt; { let list = ( lt;ul id='test'gt; {context.exercises[id]?.map((exercise) =gt; { return ( lt;ligt; {item.name} lt;/ligt; ); })} lt;/ulgt; ); html2canvas(list as HTMLElement, { allowTaint: false, width: window.innerWidth, height: window.innerHeight, scrollX: window.pageXOffset, scrollY: window.pageYOffset, x: window.pageXOffset, y: window.pageYOffset, imageTimeout: 1500, }).then((canvas) =gt; { document.body.appendChild(canvas); // if you want see your screenshot in body. const imgData = canvas.toDataURL('image/png'); // const pdf = new jsPDF(); // let w = document.querySelector('#capture')?.scrollWidth; // let h = document.querySelector('#capture')?.scrollHeight; // console.log(h, typeof h); // pdf.addImage(imgData, 'PNG', 0, 0, w! / 10, h! / 10); // pdf.save('download.pdf'); });