React Native中如何仅向数组添加新的蓝牙设备?
解决React Native蓝牙扫描重复添加设备的问题
你遇到的includes判断失效问题,本质是因为引用类型的浅比较逻辑不适用:每次蓝牙扫描返回的device都是新创建的对象,即使两个设备的信息完全一致,它们的对象引用也不同,includes用===判断时会认为是不同的元素,导致重复添加。
以下是几种可靠的解决方式:
1. 通过设备唯一ID判断(最推荐)
每个BLE设备都有唯一的id属性(由蓝牙硬件分配),这是判断设备是否已存在的最可靠依据。使用数组的some方法检查现有列表中是否存在相同id的设备:
// 蓝牙扫描回调逻辑 this.manager.startDeviceScan(null, null, (error, device) => { if (error) { console.error('扫描出错:', error); return; } // 检查设备是否已存在 const isDuplicate = this.state.devices.some(existingDevice => existingDevice.id === device.id); if (!isDuplicate) { this.setState(prevState => ({ devices: [...prevState.devices, device] })); } });
2. 同时更新设备实时信息(如信号强度)
如果需要实时更新设备的rssi(信号强度)等动态信息,而不是仅添加一次,可以先更新已有设备,再处理新设备:
this.setState(prevState => { // 先更新已有设备的信息 const updatedDevices = prevState.devices.map(dev => dev.id === device.id ? device : dev ); // 如果是新设备,添加到列表末尾 if (!prevState.devices.some(dev => dev.id === device.id)) { updatedDevices.push(device); } return { devices: updatedDevices }; });
3. 用Set优化判断效率(适合大量设备场景)
如果扫描到的设备数量较多,用Set存储已有的设备ID可以让判断操作从O(n)降到O(1),提升性能:
// 初始化组件state state = { devices: [], trackedDeviceIds: new Set() }; // 扫描回调内逻辑 this.manager.startDeviceScan(null, null, (error, device) => { if (error) return; if (!this.state.trackedDeviceIds.has(device.id)) { this.setState(prevState => ({ devices: [...prevState.devices, device], trackedDeviceIds: new Set(prevState.trackedDeviceIds).add(device.id) })); } });
内容的提问来源于stack exchange,提问作者Andrew
相关产品推荐
相关产品推荐

