javascript 图片推拽到图片上覆盖

思路：图片设置z-index为最底部，再添加一个div模板设置为z-index: 999 这样拖拽文件会触发新建的div，然后在drop事件修改图片的dom

        <el-image
          :src="URL"
          v-if="isShowImg"
          style="width: 770px; height: 433px"
          :preview-src-list="[URL]"
        >
		<div id="dragDropDiv" ref="allimg"></div>
		
		mounted() {
		    setTimeout(() => {
		      var that = this;
		      let allimg = document.getElementById("dragDropDiv");
		      allimg.ondragenter =
		        allimg.ondragover =
		        allimg.ondragleave =
		          function () {
		            // 阻止默认事件
		            return false;
		          };
		      //释放文件
		      allimg.addEventListener("drop", that.onDrop);
		    }, 0);
		  },
	  methods: {
		    onDrop(e) {
		      var that = this;
		      let ev = window.event || e;
		      ev.preventDefault();
		      this.imgSaveToUrl(e.dataTransfer.files[0],1,true)  //替换图片标签链接
		    },
	}
	<style>
	.el-upload-dragger {
		  display: flex;
		  justify-content: center;
		  align-items: center;
		  flex-direction: column;
		  border: none !important;
		  z-index: 999 !important;
		}
	</style>