vuejs的离子本征角示例代码

Question

bounty到期在4天内。该问题的答案有资格获得+ 250声望赏金。user1469734正在寻找canonical answer：“可能我不是第一个将VueJS与Ionic一起使用的人，但Ionic的文档仍然引用Angular”

使用Ionic Native，可以通过本机插件使用iBeacons：https://ionicframework.com/docs/native/ibeacon

示例代码是为使用AngularJS使用Ionic的人编写的，但是我使用的是VueJS，但我不知道如何使它工作：

示例代码的Angular版本：

import { IBeacon } from '@ionic-native/ibeacon/ngx';

constructor(private ibeacon: IBeacon) { }

...


// Request permission to use location on iOS
this.ibeacon.requestAlwaysAuthorization();
// create a new delegate and register it with the native layer
let delegate = this.ibeacon.Delegate();

// Subscribe to some of the delegate's event handlers
delegate.didRangeBeaconsInRegion()
  .subscribe(
    data => console.log('didRangeBeaconsInRegion: ', data),
    error => console.error()
  );
delegate.didStartMonitoringForRegion()
  .subscribe(
    data => console.log('didStartMonitoringForRegion: ', data),
    error => console.error()
  );
delegate.didEnterRegion()
  .subscribe(
    data => {
      console.log('didEnterRegion: ', data);
    }
  );

let beaconRegion = this.ibeacon.BeaconRegion('deskBeacon','F7826DA6-ASDF-ASDF-8024-BC5B71E0893E');

this.ibeacon.startMonitoringForRegion(beaconRegion)
  .then(
    () => console.log('Native layer received the request to monitoring'),
    error => console.error('Native layer failed to begin monitoring: ', error)
  );

但是..我期望工作的是VueJS中的以下内容：

在导入组件的顶部：import { IBeacon } from '@ionic-native/ibeacon/ngx';

并像这样使用它：

foobar() {
let _ibeacon = IBeacon.Delegate()
  alert('Hi iBeacon');
  _ibeacon.didStartMonitoringForRegion()
    .subscribe(
      data => console.log('didStartMonitoringForRegion: ', data),
      error => console.error()
    );
}

但是即使警报也没有显示。将iBeacon插件与Vue和ionic一起使用的正确方法是什么？

Answer 1

[C0的速记]有效。只需替换两个文件。