uni-app NVUE的textarea组件的blur方法在IOS无法获取cursor

uni-app NVUE的textarea组件的blur方法在IOS无法获取cursor

示例代码：

onBlur(ev){
//监听失去焦点
console.log(ev);
// this.cursor = ev;
},

操作步骤：

在nvue中使用textarea组件监听@blur并获取event参数中的cursor

预期结果：

获取光标cursor位置

实际结果：

IOS端无法获取，安卓端正常

bug描述：

nvue中使用textarea组件监听@blur中发现IOS端无法获取cursor


| 信息类别       | 信息内容           |
|----------------|--------------------|
| 产品分类       | uniapp/App         |
| PC开发环境     | Windows            |
| PC操作系统版本 | win10              |
| HBuilderX类型  | 正式               |
| HBuilderX版本  | 3.1.22             |
| 手机系统       | Android            |
| 手机系统版本   | Android 10         |
| 手机厂商       | 华为               |
| 手机机型       | HONOR X10          |
| 页面类型       | nvue               |
| 打包方式       | 云端               |
| 项目创建方式   | HBuilderX          |

更多关于uni-app NVUE的textarea组件的blur方法在IOS无法获取cursor的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

问题复现，后续优化，已加分，感谢您的反馈！

更多关于uni-app NVUE的textarea组件的blur方法在IOS无法获取cursor的实战教程也可以访问 https://www.itying.com/category-93-b0.html


HBuilderX alpha 3.2.5+ 已修复

这是一个已知的 nvue textarea 组件在 iOS 平台的兼容性问题。在 iOS 上，blur 事件返回的 event 对象中确实不包含 cursor 属性，而 Android 平台可以正常获取。

问题原因： iOS 系统的 WKWebView 内核在失去焦点时不会提供光标位置信息，这是底层系统的限制。

临时解决方案：

  1. 使用 @input 事件替代
    在输入过程中实时记录光标位置：

    onInput(ev) {
  this.cursor = ev.detail.cursor
},
onBlur() {
  // 使用之前记录的光标位置
  console.log('光标位置：', this.cursor)
}

  2. 使用 focus 事件记录
    在获得焦点时记录当前光标位置：

    onFocus(ev) {
  this.lastCursor = ev.detail.cursor
},
onBlur() {
  console.log('最后记录的光标位置：', this.lastCursor)
}
回到顶部