首页 文章

Cordova - onDeviceReady事件监听器背后的逻辑

提问于
浏览
0

我正在学习本教程:https://software.intel.com/en-us/xdk/articles/cordova-core-plugin-camera-short-code-example

它在使用Cordova 6.5.0运行iOS 10的iPhone 5上完美运行

但是,我不明白在设备准备就绪时调用的函数中何时以及必须放置什么的逻辑 .

如您所见,设备准备就绪时会调用onDeviceReady:

document.addEventListener( “deviceready”,onDeviceReady,FALSE);

// device APIs are available
//
function onDeviceReady() {
    pictureSource=navigator.camera.PictureSourceType;
    destinationType=navigator.camera.DestinationType;
}

但是其他API调用(如拍摄实际图片)不需要该步骤(只要调用它的按钮可见,就可以调用该函数):

// A button will call this function
//
function capturePhoto() {
  // Take picture using device camera and retrieve image as base64-encoded string
  navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
    destinationType: destinationType.DATA_URL });
}

将onDeviceReady函数的内容放在capturePhoto函数中并在页面加载后等待几秒钟就会破坏整个事情 - 为什么?

另外,为什么 navigator.camera.DestinationType 与要求你使用 Camera.DestinationType 的官方教程有所不同?

迄今为止我从答复中学到了什么

如果我出错了,请纠正我

每当DOM加载时调用javascript cordova函数,就会发生本机cordova代码尚未就绪的情况 . 但是通过将该代码放在onDocumentReady函数中,您可以绕过它 .

2 回答

  • 0

    加载/初始化Cordova API后会触发 deviceready 事件 . 如果您正在使用Cordova API中的函数,那么保证它已加载并因此可以使用的最佳方法是仅在库加载后启动应用程序逻辑 . 即使用 deviceready 来"initialize"您的申请 .

    这类似于在文档加载之前尝试访问 HTMLElement (例如,绑定事件处理程序) .

    例如 .

    class App
    {
        constructor() {
            console.log("Loaded!");
    
            this.bindEvents = this.bindEvents.bind(this);
            this.click = this.click.bind(this);
        }
    
        bindEvents() {
            document.getElementById('button').addEventListener('click', this.click);
        }
    
        click() {
            navigator.camera.getPicture(...);
        }
    }
    
    document.addEventListener('deviceready', () => {
        // Do all bindings here / start using API.
        let app = new App();
        app.bindEvents();
    }, false);
    

    您的“按钮”工作并启动相机的原因是因为您在应用启动之前恰好等待了足够长的时间才能点击按钮 . 应用程序启动后,您可以尝试尽快单击“按钮” . 您可以在设备准备好之前单击它(取决于需要多长时间) .

    关于您的特定代码,您所做的只是为Camera API创建“别名” .

  • 0

    完全初始化cordova后,onDeviceReady事件被触发一次 . 使用插件时,您需要做的就是确保在捕获onDeviceReady()事件后调用插件接口 . 每次需要使用插件时都不需要等待它 . 还有其他值得一提的事件,在这里您可以阅读有关cordova应用程序生命周期的内容:https://cordova.apache.org/docs/en/latest/cordova/events/events.html

    只是尝试捕获不同的事件并打印出一些控制台日志,以查看何时触发不同的事件(良好的学习技术顺便说一下) .

    使用插件调用时,需要使用插件函数挂钩的命名空间 . 有时这些函数可以从不同的对象访问,这就是为什么教程中存在一些后果 . 为了确保你会打电话给你想要的东西,你可以随时查看插件文档或插件www目录,在那里你可以找到javascript界面文件 .

相关问题