需求

文本框支持粘贴 以及拖拽上传

前置条件

vue2

代码

<template>
  <div>
    <input type="text" @paste="onPasteUpload($event)" @drop="dropFile" />
  </div>
</template>

<script>
export default {
  methods: {
    // 粘贴上传
    onPasteUpload(event) {
      let items = event.clipboardData && event.clipboardData.items;
      let file = null;
      if (items && items.length) {
        for (let key in items) {
          if (items[key].kind == "file") {
            // file就是文件 
            file = items[key].getAsFile();
            // 拿到文件后去处理自己对应的上传逻辑即可
          }
        }
      }
    },
    //拖拽上传
    dropFile(e){
       let file =  e.dataTransfer.files //相同去处理对应逻辑
    },
  },
};
</script>