Vue 监听输入框(input、textarea ...)粘贴事件获取图片、视频、文件、文件夹

• Vue 通过 贴贴 事件监听，拿到 图片、视频、文件、文件夹，可以上传之后使用，也可以先展示后上传。

  <template>
    <div>
      <input @paste="pasting">
      <img :src="url">
    </div>
  </template>
  
  <script>
  export default {
    data () {
      return {
        // 贴贴图片地址
        url: undefined
      }
    },
    methods: {
      // 贴贴事件
      pasting (e) {
        // 获取剪切板图片、视频、文件、文件夹
        const file = e.clipboardData.files[0]
        // 拿到文件对象后，先上传或先展示都行，这里以图片进行举例
        // 如果是直接上传服务器，那可以拿到图片地址直接使用
        // 如果不进行上传，先展示，等点击确定在上传，那就自己创建一个链接进行使用
        const windowURL = window.URL || window.webkitURL
        this.url = windowURL.createObjectURL(file)
      }
    }
  }
  </script>