react中使用Modal.confirm数据不更新的问题解决

在使用Modal.confirm的时候今天发现了个疑惑的问题，为什么我明明从新set了数据而页面视图没有变化，查了一下官方文档找到了答案，解决了这个问题，特意在这里留下痕迹。

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
    )
}

上述的代码是有问题的，据说会发生我上述的问题，数据并不能更新。
首先看一下官方的解释：

我们只需要在生成Modal的时候接收返回的实例对象
然后调用update方法即可更新数据

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

全部代码：

```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
    )
}