iframe如何获取antd的样式

Question

需求场景

打印

iframe打印方案

const handlePrint = useDebounceFn(() => {

  // 判断iframe是否存在，不存在则创建iframe

  let iframe = document.getElementById("print-iframe");

  if (!iframe) {

    var el = document.getElementById("table");

    iframe = document.createElement('IFRAME');

    var doc = null;

    iframe.setAttribute("id", "print-iframe");

    iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');

    document.body.appendChild(iframe);

    doc = iframe.contentWindow.document;

    //这里可以自定义样式

    doc.write('<style media="print">@page {size: auto;margin: 0mm;}</style>'); // 解决出现页眉页脚和路径的问题

    doc.write('<div>' + el.innerHTML + '</div>');

    doc.close();

    iframe.contentWindow.focus();

  }

  setTimeout(function () { iframe.contentWindow.print(); }, 50)  // 解决第一次样式不生效的问题

  if (navigator.userAgent.indexOf("MSIE") > 0) {

    document.body.removeChild(iframe);

  }

}, {})

render(){
return <Table datasource={data} columns={columns} id="table"  />
}

问题

预览出的iframe展示的table没有antd的样式，请问如何才能让iframe拿到antd的样式。

我试着这样写，但是不正确

doc.write(`<LINK rel="stylesheet" type="text/css" href="${require('antd/dist/antd.css')}">`);