uni-app checkbox-group 在iPhone12的iOS 14系统上onchange事件不会触发,在iOS 17系统就可以

发布于 1周前 作者 eggper 来自 Uni-App

uni-app checkbox-group 在iPhone12的iOS 14系统上onchange事件不会触发,在iOS 17系统就可以

项目信息 详情
产品分类 uniapp/App
PC开发环境操作系统 Mac
PC开发环境操作系统版本号 14.3
HBuilderX类型 正式
HBuilderX版本号 3.99
手机系统 iOS
手机系统版本号 iOS 14
手机厂商 苹果
手机机型 iPhone122
页面类型 vue
vue版本 vue3
打包方式 云端
项目创建方式 HBuilderX

示例代码:

<checkbox-group v-else @change="checkboxChange">  
<div  
class="member-item"  
v-for="item in friendList"  
key="item.accountId"
    >
  <checkbox
    class="checkbox"  
value="item.accountId"
checked="item.checked"
disabled="
      item.disabled ||
      (selectAccount.length >= max &&
        !selectAccount.includes(item.accountId))
    "
  />
  <Avatar class="user-avatar" size="36" :account="item.accountId" />
  <div class="user-name">
    <Appellation :account="item.accountId" />
  </div>
</div>
</checkbox-group>

操作步骤:

checkbox-group 在iPhone12 的14系统上,onchange 事件不会触发,在17系统就可以

预期结果:

checkbox-group 在iPhone12 的14系统上,onchange 事件会触发

实际结果:

checkbox-group 在iPhone12 的14系统上,onchange 事件不会触发,在17系统就可以

bug描述:

checkbox-group 在iPhone12 的14系统上,onchange 事件不会触发,在17系统就可以


1 回复

针对您提到的uni-app中checkbox-group组件在iPhone 12的iOS 14系统上onchange事件不会触发的问题,这可能是由于系统兼容性问题或者uni-app框架在某些旧版iOS系统上的bug导致的。由于无法直接修改iOS系统的行为,我们主要可以通过调整代码逻辑或尝试一些替代方案来解决或规避这个问题。

以下是一个基本的checkbox-group使用示例,并包含一些可能的解决方案思路,虽然直接解决iOS 14触发问题的代码可能不存在(因为这通常需要框架或系统层面的修复),但可以通过一些变通方法如使用@click事件辅助监测变化:

<template>
  <view>
    <checkbox-group @change="handleCheckboxChange">
      <label v-for="(item, index) in items" :key="index">
        <checkbox :value="item.value">{{ item.label }}</checkbox>
      </label>
    </checkbox-group>
    <!-- 辅助点击事件,用于iOS 14兼容尝试 -->
    <checkbox-group ref="checkboxGroup" @click.native="handleCheckboxClick">
      <!-- 同上 -->
    </checkbox-group>
  </view>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { value: 'apple', label: 'Apple' },
        { value: 'orange', label: 'Orange' },
        { value: 'banana', label: 'Banana' }
      ],
      selectedValues: []
    };
  },
  methods: {
    handleCheckboxChange(e) {
      this.selectedValues = e.detail.value;
      console.log('Checkbox changed:', this.selectedValues);
    },
    handleCheckboxClick() {
      // 尝试手动触发变化检测,仅作为兼容iOS 14的尝试
      this.selectedValues = this.$refs.checkboxGroup.children.map(child => child.value).filter(value => !!value);
      console.warn('Manually triggered checkbox check due to iOS 14 compatibility issue');
    }
  }
};
</script>

注意

  1. 上述代码中的@click.native监听器是一个尝试性的解决方案,用于在iOS 14上手动检测复选框组的变化。这种方法并不优雅,且可能引入其他问题,如多次触发等。
  2. 更好的做法是持续关注uni-app的官方更新和社区反馈,看是否有针对旧版iOS系统的修复或官方建议。
  3. 如果问题依旧存在且影响用户体验,考虑向uni-app官方提交bug报告,或寻求社区的帮助。

希望这些信息对您有所帮助!

回到顶部