### 🧐 问题描述初学,发现ProTable无打印功能，东拼西凑自己搞了个ProTable弹窗打印,请教怎么在Modal里自动执行handlePrint, ### 💻 FrPrint/index.tsx ``` import React, { useRef } from 'react'; import { Modal } from 'antd'; import { useReactToPrint } from "react-to-print"; import csstyle from "./index.less"; import moment from 'moment'; import ProTable from '@ant-design/pro-table'; import { WaterMark } from '@ant-design/pro-layout'; import { useModel } from 'umi'; export type FormValueType = { target?: string; template?: string; type?: string; time?: string; frequency?: string; }; /** * */ export type UpdateFrPrintProps = { title?: string; subTitle?: string; columns: any[]; dataSource: any[]; onCancel: (flag?: boolean, formVals?: FormValueType) => void; printModalVisible: boolean; }; const FrPrint: React.FC = (props) => { const { initialState } = useModel('@@initialState'); const componentRef = useRef(); const handlePrint = useReactToPrint({ content: () => (componentRef.current != undefined) ? componentRef.current : null, onBeforeGetContent: () => (props.onCancel()) }); console.log('columns', props.columns); const date = moment().format('YYYY-MM-DD HH:mm:ss').toString(); return ( { props.onCancel(); }} onOk={() => { handlePrint(); }} keyboard={true} >

西藏大麦 · Dmart

{props.title}

{props.subTitle}

{/* 普通 Table columns 不支持 valueType 属性 */} columns={props.columns} dataSource={props.dataSource} rowKey="key" pagination={false} search={false} toolBarRender={false} bordered size="small" />

打印日期:{date}

); }; export default FrPrint; ``` ### 🚑 调用 ``` ``` ``` { handlePrintModalVisible(false); }} printModalVisible={printModalVisible} /> ``` ![1652065846(1)](https://user-images.githubusercontent.com/77309632/167335204-4a5808be-e5f8-45b3-a6cd-bd88ac855140.png)

🧐[求助]搞了个ProTable弹窗打印,但是不知怎么能让弹窗以后自动调用打印 #9821

Company

Community

Support

Connect