在 Laravel 中使用 idle-vue答案

【问题标题】：Using idle-vue with Laravel在 Laravel 中使用 idle-vue
【发布时间】：2022-01-27 06:14:32
【问题描述】：

我想将idle-vue 插件与Laravel 一起使用，但我不知道如何在我的app.js 文件中注册该模块。

idle-vue 文档显示：

import IdleVue from "idle-vue";
import store from './store'

const eventsHub = new Vue();

Vue.use(IdleVue, {
  eventEmitter: eventsHub,
  store,
  idleTime: 3000, // 3 seconds
  startAtIdle: false
});

在 Laravel 中注册这个组件的正确方法是什么？

【问题讨论】：

标签： laravel vue.js

【解决方案1】：

您必须按照idle-vue doc 中提到的相同步骤进行操作。

您的 app.js 如下所示。

import Vue from 'vue'

// Your code
import IdleVue from "idle-vue";
import store from './store'

const eventsHub = new Vue();

Vue.use(IdleVue, {
    eventEmitter: eventsHub,
    store,
    idleTime: 3000, // 3 seconds
    startAtIdle: false
});
// Your code ends

// Register vue instance using id in div tag.
new Vue({
   el: '#app',
   // Added code from document
   data () {
       return {
           messageStr: 'Hello'
       }
   },
   onIdle() {
       this.messageStr = 'ZZZ'
   },
   onActive() {
       this.messageStr = 'Hello'
   }
});

idle-vue document

刀片文件

<div id=app>
    <p>
        {{ messageStr }}
    </p>  
</div>
//Call compiled js file from your asset directory
<script src="{{ asset('app.js') }}"><script>

【讨论】：

我不明白你刚刚写了什么。 1.您提供的链接没有您写的内容 2.我在上面发布了相同的代码。 3. 显然这不是你在 Laravel 中注册它的方式，这正是我的问题