uni-app微信小程序如何在弹窗出现的时候获取弹窗内的输入框焦点

在uni-app开发微信小程序中，当弹窗（Modal）出现并且包含输入框（Input）时，你可以通过监听`input`元素的`focus`事件来获取焦点。首先，在弹窗组件的数据里，你需要定义一个表示输入框是否聚焦的状态，比如：

data() {
  return {
    modalVisible: false,
    focusOnInput: false // 新增一个变量用于追踪输入框焦点状态
  }
}

然后，在你想显示弹窗的地方，添加打开弹窗并监听输入框焦点的代码：

openModal() {
  this.modalVisible = true;
  const inputEle = this.$refs.yourInputRef; // 假设输入框的ref名为yourInputRef
  if (inputEle) {
    inputEle.focus(); // 当弹窗打开时立即聚焦输入框
    inputEle.addEventListener('focus', () => { // 监听输入框聚焦事件
      this.focusOnInput = true;
    });
    inputEle.addEventListener('blur', () => { // 监听输入框失去焦点事件
      this.focusOnInput = false;
    });
  }
},
closeModal() {
  this.modalVisible = false;
  // 如果需要，移除之前的事件监听
  if (this.focusOnInput) {
    // 这里可以移除inputEle的事件监听，防止内存泄漏
    // 具体代码取决于uni-app API，可能类似于 this.$refs.yourInputRef.removeEventListener('focus', ...)
  }
}

在模板部分，确保将`ref`属性应用到输入框上：

<view v-if="modalVisible">
  <input type="text" ref="yourInputRef" placeholder="请输入内容" @focus="handleFocus" />
</view>

并在对应的JS文件中处理`handleFocus`函数：

methods: {
  handleFocus(e) {
    this.focusOnInput = true; // 更新状态
  }
}

当你需要检查输入框是否有焦点时，可以直接访问`focusOnInput`这个数据字段。例如：

if (this.focusOnInput) {
  console.log('当前有输入框聚焦');
} else {
  console.log('输入框未聚焦');
}