React antd 封装一个简单的图片预览组件

import React, { useState } from 'react'
import * as ReactDOM from 'react-dom';
import { Modal } from 'antd'

const Index = props => {
    const [visible, setVisible] = useState(true)
    const { url, cancelCallback } = props

    const handleCancel = () => {
        setVisible(false)
        cancelCallback && cancelCallback()
    }

    return (
        
            

                
            
            
        
    )
}

const PreviewImages = (props = {}) => {
    const { url, callback } = props

    const div = document.createElement('div')
    document.body.appendChild(div)

    const cancelCallback = () => {
        const result = ReactDOM.unmountComponentAtNode(div)
        if (result && div.parentNode) {
            div.parentNode.removeChild(div)
        }
        callback && callback()
    }

    ReactDOM.render(
        ,
        div
    )
}

export default PreviewImages;