Vue.js iplagi yokufumana abasebenzisi abangasebenziyo / abangasebenziyo

Ibhlog

Vue.js iplagi yokufumana abasebenzisi abangasebenziyo / abangasebenziyo

Vue.js iplagi yokufumana abasebenzisi abangasebenziyo / abangasebenziyo

v-ayisebenzi

Ndiyaqalisa

V-idle yiVue.js iplagi yokufumana abasebenzisi abangasebenziyo / abangasebenziyo.

Ukufakwa

Sebenzisa i-NPM:

npm install v-idle --save

Ukusetyenziswa okusisiseko

Jonga. Js

import Vue from 'vue' import Vidle from 'v-idle' Vue.use(Vidle)

Kuyafana nuxt.

I-Nuxt.js

Yenza i-vidle.js kulawulo lweeplagi:

Uhlalutyo lwedatha izimvo zeprojekthi
import Vue from 'vue' import Vidle from 'v-idle' Vue.use(Vidle)

Ke kwi-nuxt.config.js:

module.exports = { plugins: [ { src: '~/plugins/vidle.js' } ] }

Icandelo

Ngaphakathi usebenzisa i-v-idle element:

Iya kubonisa ukubala ixesha emva kwe-05: 00 ngokungagqibekanga.

Khetha

@idle

Uhlobo: Umsebenzi

Okwendalo: akukho

Iphumeza xa isibali-xesha sifika ngo-00: 00

@memes

Uhlobo: Umsebenzi

Okwendalo: akukho

Iphumeza xa isibali xesha lifikelela ixesha kwimizuzwana ngaphambi kwentsimbi ye-00: 00

izikhumbuzo

Uhlobo: Uluhlu

Ukungagqibeki: uluhlu olungenanto

Uluhlu ngamasekhondi. Ixabiso ngalinye liya kwenza @remind

loop

Uhlobo: I-Boolean

Okwendalo: bubuxoki

Ukuba imiselwe kwinyani, isibali-xesha siza kuqala ukwenziwa kwakhona emva ko-00: 00

iziganeko

Uhlobo: Uluhlu

Okwendalo: [‘imowmovement’, ‘keypress’]

Isiganeko ngasinye siyakwaphula ukubala.

Yima

Uhlobo: Inani

Ukungagqibeki: 0

Zingaphi isibini zokulinda ngaphambi kokuqala ukubala.

itemplate yomlawuli olula bootstrap

ubude bexesha

Uhlobo: Inani

Ukungagqibeki: 60 * 5

Ukuba kwimizuzwana, ixabiso elisisiseko li-60 * 5 imizuzwana, ke imizuzu emi-5.

Umzekelo

Yenza isibambi xesha semizuzwana engama-300 (imizuzu emi-5) nge-loop, khumbuza i-10 kunye ne-15 yesibini phambi ko-00: 00 ngomsebenzi onremind (), linda imizuzwana emi-5 ngaphambi kokubonisa umsebenzisi isibali xesha, yenza umsebenzi onidle () xa isibali sifike ngo-00: 00.

methods: { onidle() { alert('You have been logged out'); }, onremind(time) { // alert seconds remaining to 00:00 alert(time); } }

Uvavanyo

Ukuqhuba uhlobo lovavanyo:

npm run test

Ukuqhuba uhlobo oluthile lovavanyo:

npm run test -- -t 'test_name'

Khuphela iinkcukacha:

Umbhali: malekim

Ikhowudi yonikezo: https://github.com/malekim/v-idle

#zijs #vue #javascript