小程序开发时 wx.showActionSheet 这个函数, 在点击对应选项后,有时候ActionSheet不会自动隐藏,是什么原因,如何改进为必然自动隐藏?
在小程序开发中,wx.showActionSheet 通常在点击选项后由系统自动收起。如果出现不自动隐藏的情况,通常是由于逻辑阻塞或系统/版本差异导致的。

  1. 常见原因分析
    回调函数内存在阻塞逻辑:在 success 回调中执行了耗时过长的同步操作(如复杂的循环计算),导致 UI 线程响应滞后。
    并发冲突:在 success 回调中立即触发了另一个模态框(如 wx.showModal 或 wx.showLoading),部分 Android 版本下,新的 UI 层可能会干扰 ActionSheet 的正常销毁流程。
    Android 版本特异性:在旧版 Android(6.7.2 以下)中,点击背景蒙层或取消按钮的行为与 iOS 不同,若逻辑依赖于 fail 回调执行清理,可能会出现异常。
    itemList 溢出或限制:如果 itemList 长度超过 6 个,或者在点击后立即执行了页面跳转/重载,可能导致组件状态未能正确更新.

我的小程序中是因为立即调用了showModal导致的, modal显示后actionSheet没有消失反而叠加在其上. 并且只有第一次会出现, 第二次就不再出现了(我猜测可能showActionSheet所有已经加载到了内存中).
需要使用延时的方法来解决(100ms足够), 如果是用await调用wx.showActionSheet, 也需要在调用后进行延时再处理其他逻辑.

wx.showActionSheet({
  itemList: ['选项A', '选项B'],
  success(res) {
    // 先让 ActionSheet 消失,再处理逻辑
    setTimeout(() => {
      // 这里放置业务代码,如打开 Loading 或 跳转
      console.log('点击了第', res.tapIndex, '项');
    }, 100); 
  }
});

标签: none 阅读量: 134

添加新评论