Javascript Vue可以'；不要听科尔多瓦事件_Javascript_Cordova_Vue.js

Javascript Vue可以'；不要听科尔多瓦事件

javascript cordova vue.js

Javascript Vue可以'；不要听科尔多瓦事件,javascript,cordova,vue.js,Javascript,Cordova,Vue.js,我正在尝试使用Cordova构建一个混合应用程序。我正在使用VueJS进行路由和AJAX请求不幸的是，我无法捕捉到一些Cordova事件。甚至devicerady事件也无法工作这是我的文件： require('./bootstrap'); var Vue = require('vue'); var VueRouter = require('vue-router'); Vue.use(VueRouter); // Some components Vue.component('test',

我正在尝试使用

Cordova

构建一个混合应用程序。我正在使用VueJS进行路由和AJAX请求

不幸的是，我无法捕捉到一些

Cordova

事件。甚至

devicerady

事件也无法工作
这是我的文件：

require('./bootstrap');


var Vue = require('vue');
var VueRouter = require('vue-router');

Vue.use(VueRouter);

// Some components
Vue.component('test', require('./Vue/components/test.vue'));
Vue.component('mainnav', require('./Vue/partials/mainnav.vue'));

// Route-components
const Home = Vue.component('home', require('./Vue/pages/home.vue'));
const Login = Vue.component('login', require('./Vue/pages/auth/login.vue'));
const Register = Vue.component('register', require('./Vue/pages/auth/register.vue'));
const notFound = Vue.component('notFound', require('./Vue/pages/404.vue'));

// the routes
const routes = [
    { path: '', component: Home },
    { path: '/', component: Home },
    { path: '/login', component: Login },
    { path: '/register', component: Register },
    { path: '*', component: notFound }
];

const router = new VueRouter({
    mode: 'history',
    routes // short for routes: routes
});

const vueApp = new Vue({
    router,
    mounted: function(){
        //alert('VueJS is ready!');
        document.addEventListener('deviceReady', this.onDeviceReady, false);
    },
    methods: {
        onDeviceReady: function() {
            alert('Device is ready!');
        }
    }
}).$mount('#app');

可能我没有收到消息，因为设备在Vue准备好之前就准备好了。但是我该怎么处理呢

我可以从Vue

根实例和Vue组件访问其他选项，例如振动插件
：
export default {
    data() {
        return {
            vibrateDuration: 5000,
        };
    },
    methods: {
        letsVibrate: function(){
            navigator.vibrate(this.vibrateDuration);
        }
    }
}

您知道如何在Vue中捕获设备就绪事件吗？
这可能是一个并发性问题。尝试设置一些简单的信号量锁，仅当两个都打开时触发函数（未测试，但您知道了）：
尝试：
vueApp = new Vue({ 
   //...
    methods: { 
          onDeviceReady: function() {
               alert('Device is ready!');
            } 
       } 
});

document.addEventListener(
      'deviceready', 
       vueApp.onDeviceReady
);

对于vue应用程序，您必须明确地将
添加到public/index.html

<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
    <title>My app</title>
  </head>
  <body>
    <script src="cordova.js"></script> <!-- dude, add this -->
    <div id="app"></div>
    <noscript>
      <strong
        >We're sorry but ia doesn't work properly without JavaScript enabled.
        Please enable it to continue.</strong
      >
    </noscript>
  </body>
</html>


我的应用程序
很抱歉，如果没有启用JavaScript，ia无法正常工作。
请使其继续。
你找到答案了吗？我也遇到了同样的问题。。。
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
    <title>My app</title>
  </head>
  <body>
    <script src="cordova.js"></script> <!-- dude, add this -->
    <div id="app"></div>
    <noscript>
      <strong
        >We're sorry but ia doesn't work properly without JavaScript enabled.
        Please enable it to continue.</strong
      >
    </noscript>
  </body>
</html>