项目场景：

这个东西

演示
(虚假数据,演示用途)

方案

没啥特别的 点击操作取卡 聚焦输入框 代码如下

		this.clearInput();
          this.icCardNo = "";
          const _that = this;
          const activeElement = document.activeElement;
          activeElement.blur(); //找到modal弹框之前的 focus元素
          let inputEle = document.createElement("input");
          inputEle.type = "text";
          inputEle.setAttribute("id", "icCard-input");
          inputEle.setAttribute("value", "");
          inputEle.style =
            "height:0px;width:0px;padding:0px;border:0.1px;z-index:-9999;position:absolute;top:0;";
          document.body.appendChild(inputEle);
          inputEle.focus();
          inputEle.addEventListener("input", function() {
            // 监听 读卡器输入框的输入事件
            if (inputEle.value.length == 10) {
              // 10位截断
              _that.icCardNo = inputEle.value;
              inputEle.value = "";
            }
          });
          this.modalTitle = "取卡叫号";
          this.showModal = true;
          this.$nextTick(() => {
            const modal = document.getElementsByClassName("vxe-modal--wrapper");
            for (let i = 0; i < modal.length; i++) {
              // 监听modal click事件
              if (modal[i].className.indexOf("is--active") != -1) {
                // 获取当前的modal
                modal[i].addEventListener("click", e => {
                  // 监听modal 蒙层的点击事件
                  if (e.target.tagName == "DIV") {
                    // 遮罩层点击
                    let inputEle = document.getElementById("icCard-input");
                    inputEle.focus();
                  }
                });
              }
            }
          });

然后是 clearInput 方法

clearInput() {
      // 清除取卡叫号的 原生添加的input输入框框
      let inputEle = document.getElementById("icCard-input");
      if (inputEle) document.body.removeChild(inputEle);
    },

以上