uni-app 关于无法关闭蓝牙监听onBluetoothDeviceFound和onBluetoothAdapterStateChange

开发环境	版本号	项目创建方式
Windows	Windows 11 专业版	HBuilderX

产品分类：uniapp/App

PC开发环境操作系统：Windows

HBuilderX类型：正式

HBuilderX版本号：3.98

手机系统：iOS

手机系统版本号：iOS 16

手机厂商：苹果

手机机型：IPhone13

页面类型：vue

vue版本：vue3

打包方式：云端

示例代码：

uni.openBluetoothAdapter({
    success(res) {  
      uni.startBluetoothDevicesDiscovery({  
        allowDuplicatesKey: true,  
        success(res) {  
          uni.onBluetoothDeviceFound(function (devices) {  
               console.log(devices)  
           })  
        },  
        fail(res) {  
          console.log('error')  
        },  
      })  
    },  
    fail(res) {  
      console.log('error')  
    },  
})

操作步骤：

如bug描述

预期结果：

只新页面打印，旧页面不打印

实际结果：

新旧页面都打印

bug描述：

stopBluetoothDevicesDiscovery和closeBluetoothAdapter，无法关闭蓝牙监听onBluetoothDeviceFound和onBluetoothAdapterStateChange。

上一个页面onBluetoothDeviceFound监听蓝牙设备后使用stopBluetoothDevicesDiscovery和closeBluetoothAdapter进行关闭。点开新页面后使用onBluetoothDeviceFound，发现原本已经关闭了的旧页面仍然在监听，新旧两个页面的监听同时打印蓝牙设备数据。

phonegap100 1楼•4 天前

在 uni-app 中，使用蓝牙功能时，可能会遇到无法关闭蓝牙监听事件（如 onBluetoothDeviceFound 和 onBluetoothAdapterStateChange）的问题。这通常是因为这些事件监听器没有被正确移除或销毁。以下是一些可能的解决方案：

1. 确保正确移除监听器

在 uni-app 中，你可以使用 uni.offBluetoothDeviceFound 和 uni.offBluetoothAdapterStateChange 来移除对应的监听器。确保在不需要监听这些事件时，调用这些方法来移除监听器。

// 添加监听器
uni.onBluetoothDeviceFound((res) => {
  console.log('发现设备', res.devices);
});

uni.onBluetoothAdapterStateChange((res) => {
  console.log('蓝牙适配器状态变化', res);
});

// 在适当的时候移除监听器
uni.offBluetoothDeviceFound();
uni.offBluetoothAdapterStateChange();

2. 在页面生命周期中管理监听器

如果你在页面中使用了这些监听器，确保在页面销毁时移除它们。可以在 onUnload 或 onHide 生命周期钩子中移除监听器。

export default {
  onLoad() {
    uni.onBluetoothDeviceFound((res) => {
      console.log('发现设备', res.devices);
    });

    uni.onBluetoothAdapterStateChange((res) => {
      console.log('蓝牙适配器状态变化', res);
    });
  },
  onUnload() {
    uni.offBluetoothDeviceFound();
    uni.offBluetoothAdapterStateChange();
  }
}

3. 使用全局变量管理监听器

如果你在多个页面或组件中使用这些监听器，可以考虑使用全局变量来管理它们，确保在不需要时统一移除。

// 在 app.vue 或全局文件中
let bluetoothDeviceFoundListener = null;
let bluetoothAdapterStateChangeListener = null;

export function startBluetoothListeners() {
  bluetoothDeviceFoundListener = uni.onBluetoothDeviceFound((res) => {
    console.log('发现设备', res.devices);
  });

  bluetoothAdapterStateChangeListener = uni.onBluetoothAdapterStateChange((res) => {
    console.log('蓝牙适配器状态变化', res);
  });
}

export function stopBluetoothListeners() {
  if (bluetoothDeviceFoundListener) {
    uni.offBluetoothDeviceFound(bluetoothDeviceFoundListener);
    bluetoothDeviceFoundListener = null;
  }

  if (bluetoothAdapterStateChangeListener) {
    uni.offBluetoothAdapterStateChange(bluetoothAdapterStateChangeListener);
    bluetoothAdapterStateChangeListener = null;
  }
}

在页面中使用：

import { startBluetoothListeners, stopBluetoothListeners } from '@/utils/bluetooth';

export default {
  onLoad() {
    startBluetoothListeners();
  },
  onUnload() {
    stopBluetoothListeners();
  }
}

4. 检查蓝牙适配器状态

有时，蓝牙适配器的状态可能会影响监听器的行为。确保在关闭监听器之前，蓝牙适配器处于正确的状态。

uni.getBluetoothAdapterState({
  success(res) {
    if (res.available) {
      // 蓝牙适配器可用，可以关闭监听器
      uni.offBluetoothDeviceFound();
      uni.offBluetoothAdapterStateChange();
    }
  }
});

5. 调试和日志

如果问题仍然存在，建议添加更多的调试信息，检查监听器是否被正确移除，或者是否有其他代码在重新添加监听器。

console.log('移除蓝牙设备发现监听器');
uni.offBluetoothDeviceFound();
console.log('移除蓝牙适配器状态变化监听器');
uni.offBluetoothAdapterStateChange();