新建一个组件，最外层一个div组件绑定一个show开关变量做组件的显现与否，给这个div设置100vw+100vh，固定定位fixed；
第二次结构有一个a标签和一个内容div。
a标签是遮罩层和触发关闭事件作用； 给a标签清楚默认样式，再给予宽高100%，背景色#ccc或#000，再调整opacity设置0.3修改不透明度，点击遮罩层时触发一个关闭模态框事件；
内容div的内容就自定义，重点在于模态框的拖拽。给内容div设置绝对定位，首先位置居中，top和left50%，在transform：translate（-50%，-50%），让模态框在组件中居中展示，样式的处理完毕；
JS的逻辑，首先设置一个拖拽开关为false，在设置两个变量保存点击位置跟模态框左上角的top和left偏差值；
注册事件上，给模态框设置鼠标按下事件，当触发按下事件时更改拖拽开关为true，获得事件对象e距离屏幕可视区的top和left值，再减去模态框距离屏幕可视区的top和left值，前面两个获得值相减得到的的点击位置与模态框位置偏差值设置给先前声明的两个变量，按下事件逻辑就这。
再给windos或者最外围div（性能更好）注册一个鼠标事件，拖拽事件顶部先置判断 if(!拖拽开关){return}，当对模态框按下改变拖拽开关为true时才执行，获取事件对象e在屏幕可视区的top和left值，将获取的值减去先前按下事件时获取的top和left偏差值就得到了模态框定位应该这是的top和left值了，设置上，就实现了拖拽。
