js实现拦截粘贴并修改粘贴内容

遇到这样一个需求: 复制了excel表格的数据,然后粘贴的时候需要把表格里面的数据全部都用','分隔.
解决思路: 监听粘贴事件,读取粘贴的内容,把粘贴的内容里面的换行和tab都替换成',',然后获取当前聚焦的元素,修改当前聚焦元素的value.
注意: 由于这些API都是比较新的,所以兼容性都不太好,请谨慎使用,或者try

    // 增加粘贴监听
    addPasteListener() {
      document.addEventListener('paste', this.beforPasteHandler)
    },
    // 粘贴时把tab和换行替换成逗号
    beforPasteHandler(event) {
      let paste = (event.clipboardData || window.clipboardData).getData('text')
      paste = paste.replace(/(\r|\n|\t)/g, ',')
      paste = paste.replace(/(,,)/g, ',')
      if (paste.charAt(paste.length - 1) === ',') {
        paste = paste.substr(0, paste.length - 1)
      }
      // 写入操作,这里写的只是参考(实际上踩坑了,不能直接修改DOM,要修改虚拟DOM绑定的值才行,所以这里最好把时间绑定到需要用到组件,例如FormItem或者Input组件)
      //const selection = document.activeElement // 获取当前焦点所在元素
      //if (!selection || selection.tagName.toUpperCase() === 'BODY') return false
      //selection.value = paste
      event.preventDefault()
    },
    // 移除离开页面提示
    removePasteListener() {
      document.removeEventListener('paste', this.beforPasteHandler)
    }