js中直接使用antdv的Modal组件

平台默认提供的有弹出层组件是基于Model封装的可以直接在页面上拖拽组件使用，也可以不在页面中拖放组件直接在js调用ant-design-vue的Modal

js中直接调用的时候需要注意必须要设置getContainer属性，把 Modal 挂载到指定的 HTML 节点，本案例中是通过#id或者.className挂载到相应节点上

具体实现如下：

1.添加引用

import {Modal} from 'ant-design-vue';

2.直接调用Modal的info、error等函数，具体参数可以参考antdv官网Modal组件说明

(1).info

        Modal.info({
                title: 'info!',
                content: 'info提示',
                getContainer:() => document.querySelector('#pcx-page-root')
        })

(2).success

        Modal.success({
                title: 'success!',
                content: 'success提示',
                getContainer:() => document.querySelector('.pagetest')
        })

(3).error

        Modal.error({
                title: 'error!',
                content: 'error提示',
                getContainer:() => document.querySelector('#pcx-page-root')
        })

(4).warning

        Modal.warning({
                title: 'warning!',
                content: 'warning提示',
                getContainer:() => document.querySelector('#pcx-page-root')
        })

(5).confirm

        Modal.confirm({
                title: 'confirm!',
                content: 'confirm提示',
                getContainer:() => document.querySelector('#pcx-page-root')
        })

也可以在content中写html节点，如下：

        Modal.confirm({
                title: 'confirm!',
                content: <div><p>confirm提示</p><p>换行显示</p></div>,
                getContainer:() => document.querySelector('#pcx-page-root')
            }
        )