vue自定义事件不直接实现蓝牙连接,而是用于组件间传递蓝牙操作结果;子组件调用web bluetooth api完成扫描或连接后通过$emit('connected', {device, batterylevel})通知父组件,父组件监听@connected事件并处理,还可扩展@scan-start、@device-found、@disconnected等语义化事件,所有事件采用kebab-case命名,且需注意web bluetooth仅支持https/localhost及chrome/edge/opera等浏览器。

Vue 自定义事件本身不直接实现蓝牙连接,而是用来在组件间传递蓝牙操作的结果和状态。比如子组件负责调用 Web Bluetooth API 完成设备扫描或连接,连接成功后通过 $emit 通知父组件“已连上”,父组件再更新 UI 或触发后续逻辑。
蓝牙连接完成后用自定义事件通知父组件
子组件(如 BleConnector.vue)执行连接流程,并在成功后触发事件:
- 调用
navigator.bluetooth.requestDevice()打开系统选择框 - 连接成功后获取 GATT server、service 和 characteristic
- 调用
this.$emit('connected', { device, batteryLevel })向上抛出数据
父组件监听并响应蓝牙连接事件
父组件在模板中绑定事件,在方法中处理结果:

