Resuelva el problema de que los datos de Modal.confirm no se actualizan en reaccionar

Al usar Modal.confirm, hoy encontré un enigma. ¿Por qué obviamente restablecí los datos pero la vista de la página no cambió? Revisé la documentación oficial y encontré la respuesta. Resolví este problema y dejé rastros aquí.

import {
    
     Button, Col, Form, Input, Modal, Radio, Row, Select, Space, Spin } from 'antd'
let modal = null
export default function (props) {
    
    
    const [typeStr, settypeStr] = useState('')
    const [lookIPorAS, setlookIPorAS] = useState('ip')
    const returnModalFun = () => {
    
    
        return <Row className="m-b-10-px">
            <Col span={
    
    16} key={
    
    lookIPorAS}>
                <Radio.Group onChange={
    
    onchangeFun} value={
    
    lookIPorAS}>
                    <Radio value="ip">IP</Radio>
                    <Radio value="as">AS</Radio>
                </Radio.Group>
            </Col>
        </Row>
    }
    
   const onchangeFun = (e) => {
    
    
        setlookIPorAS(e.target.value)
    }
    
   const detailsFun = (item) => {
    
    
        setItemObj(item)
        const {
    
     type } = item
        if (type === '滥用') {
    
    
            // settypeStr('abuseString')
            modal = Modal.confirm({
    
    
                title: '请选择要查看的类型',
                content: returnModalFun(),
                onOk: () => {
    
    

                },
            })
        } else if (type === 'aaa') {
    
    
            settypeStr('type1')
            setVisible(true)

        } else if (type === 'bbb') {
    
    
            settypeStr('type2')
            setVisible(true)
        }
    }
    return (
   	null
    )
}

El código anterior es problemático, se dice que ocurrirá el problema anterior y los datos no se pueden actualizar.
Primero mire la explicación oficial:

solo necesitamos recibir el objeto de instancia devuelto al generar Modal
y luego llamar al método de actualización para actualizar los datos.

    useEffect(() => {
    
    
        modal && modal.update({
    
    
            title: '请选择要查看的类型',
            content:returnModalFun() ,
        });
    }, [lookIPorAS])

Código completo:

```javascript
import {
    
     Button, Col, Form, Input, Modal, Radio, Row, Select, Space, Spin } from 'antd'
let modal = null
export default function (props) {
    
    
    const [typeStr, settypeStr] = useState('')
    const [lookIPorAS, setlookIPorAS] = useState('ip')
    
    useEffect(() => {
    
    
        modal && modal.update({
    
    
            title: '请选择要查看的类型',
            content:returnModalFun() ,
        });
    }, [lookIPorAS])
    
    const returnModalFun = () => {
    
    
        return <Row className="m-b-10-px">
            <Col span={
    
    16} key={
    
    lookIPorAS}>
                <Radio.Group onChange={
    
    onchangeFun} value={
    
    lookIPorAS}>
                    <Radio value="ip">IP</Radio>
                    <Radio value="as">AS</Radio>
                </Radio.Group>
            </Col>
        </Row>
    }
    
   const onchangeFun = (e) => {
    
    
        setlookIPorAS(e.target.value)
    }
    
    const detailsFun = (item) => {
    
    
        const {
    
     type } = item
        if (type === '滥用') {
    
    
            // settypeStr('abuseString')
            modal = Modal.confirm({
    
    
                title: '请选择要查看的类型',
                content: returnModalFun(),
                onOk: () => {
    
    

                },
            })
        } else if (type === 'aaa') {
    
    
            settypeStr('type1')
            setVisible(true)

        } else if (type === 'bbb') {
    
    
            settypeStr('type2')
            setVisible(true)
        }
    }
    return (
   	null
    )
}