uni-app input组件的@click事件在vivo IQOO 11环境不触发

类别	信息
产品分类	uniapp/App
PC开发环境	Windows
PC版本号	Windows 10 专业版 22H2
HBuilderX类型	正式
HBuilderX版本	3.96
手机系统	Android
手机版本号	Android 13
手机厂商	vivo
手机机型	IQOO 11
页面类型	vue
vue版本	vue2
打包方式	云端
项目创建方式	HBuilderX

示例代码：

<input :name='`${el.id}_start`' :class="['uni_input_font', 'text-single-select', {'active-select': !!el.value}]" disabled :value="el.value" type="text" [@click](/user/click)="el.show = !el.show" :placeholder="el.placeholder"/>

操作步骤：

<input :name='`${el.id}_start`' :class="['uni_input_font', 'text-single-select', {'active-select': !!el.value}]" disabled :value="el.value" type="text" [@click](/user/click)="el.show = !el.show" :placeholder="el.placeholder"/>

预期结果：

input 组件的@click="el.show = !el.show"事件无反应

实际结果：

input 组件的@click="el.show = !el.show"事件无反应

bug描述：

<input :name='`${el.id}_start`' :class="['uni_input_font', 'text-single-select', {'active-select': !!el.value}]" disabled :value="el.value" type="text" [@click](/user/click)="el.show = !el.show" :placeholder="el.placeholder"/>

在vivo IQOO 11 环境下APP事件@click=“el.show = !el.show” 不生效，导致用户无法选举数据

phonegap100 1楼•3 天前

也遇到这个问题。
input 设置 disabled=“true” 后，在vivo IQOO 11上tap 事件失效。
用 view + input type=‘hidden’ hidden=‘true’ 的方式变通完成。

phonegap100 2楼•3 天前

大佬，请问可以提供一下具体参考代码吗？

itying888 3楼•3 天前

找到具体原因了，Chrome内核版本116及以上的都有这个问题。 https://bugs.chromium.org/p/chromium/issues/detail?id=1477379&q=disabled input click&can=2

bupafengyu 4楼•3 天前

// 兼容Chrome内核116及以上版本中配置disabled的input组件无法触发并冒泡click事件 .uni-input-input:disabled { pointer-events: none; }

yibo5220 5楼•3 天前

感谢反馈，我验证下，如果是这样，影响的地方挺多的。

htzhanglong 6楼•3 天前

回复 DCloud_UNI_OttoJi: 你好，最新版hx4.45还是会这样，

caililin 7楼•3 天前

请问，你的问题解决了吗？

phonegap100 8楼•3 天前

在 uni-app 中，input 组件的 @click 事件在某些特定环境下（如 vivo iQOO 11）可能无法正常触发，这可能是由于以下几个原因造成的：

1. `input` 组件的 `@click` 事件不适用

input 组件的 @click 事件并不是标准的 HTML 事件，因此在不同平台或设备上可能会有不同的行为。
如果 input 组件已经获得焦点，点击事件可能会被忽略，因为焦点已经在该组件上。

2. `vivo iQOO 11` 的特定问题

某些设备或系统版本可能存在兼容性问题，导致事件无法正常触发。
可能是 vivo iQOO 11 的浏览器内核或系统对事件的处理方式与其他设备不同。

3. 解决方案

使用 @focus 事件：如果需要在 input 组件获得焦点时执行某些操作，可以使用 @focus 事件代替 @click。
```
<input @focus="handleFocus" />
```
在 methods 中定义 handleFocus 方法：
```
methods: {
  handleFocus() {
    console.log('Input focused');
  }
}
```
使用 @tap 事件：在 uni-app 中，@tap 事件是更通用的点击事件，通常在所有设备上都能正常工作。
```
<input @tap="handleTap" />
```
在 methods 中定义 handleTap 方法：
```
methods: {
  handleTap() {
    console.log('Input tapped');
  }
}
```

使用 @input 事件：如果需要在用户输入时触发事件，可以使用 @input 事件。

<input @input="handleInput" />

在 methods 中定义 handleInput 方法：

methods: {
  handleInput(event) {
    console.log('Input value:', event.detail.value);
  }
}