1.在vue項目中的js代碼語法與之前使用js和jquery還是有所出入的，現(xiàn)遇到一個點擊按鈕出現(xiàn)倒計時30S的效果

相信大家對著兩個函數(shù)都陌生，就是一個定時器，setTimeOut只執(zhí)行一次，而setInterval會重復(fù)執(zhí)行

需要注意的是：在setInterval不用的時候一定要用clearSetInterval關(guān)閉定時器。

2.按照最原始的倒計時效果，實現(xiàn)如下：

//獲取30s 控制操作倒計時 time(){ if(this.timeWait <= 0){ this.timeWait = 0; return; }else{ this.timeWait--; } setTimeout(function(){ this.time(); }, 1000) },

此處出現(xiàn)了錯誤，報錯信息為time未定義，此處對于定時器方法其實并沒有錯

3.原因是 老生常談的javaScript 的this 的問題。

因為用的一個

function(){

}

這里的 獨立的作用域 this指向了全局（這里是window）而且window里沒有time這個函數(shù)報了錯。

4.用過vue的朋友應(yīng)該，基本vue中都是this.XXX這樣寫。這里的this是Vue對象。

所以為了使this正確指向vue，我用了ES6的尖頭函數(shù)。

setTimeout(() => { this.time();}, 1000)

尖頭函數(shù)因為它的特殊性，它的this指向它外層的對象。

補充知識：Vue使用Element UI，校驗不生效

vue中v-model=v-bind+v-on(@)

所以習(xí)慣使用v-model

今天使用Element UI 的el-form

發(fā)現(xiàn)el-input無論填什么值校驗都過不了，百思不解

最后把v-model改為:model解決

然后看了下文檔，確實使用的是:model綁定

真是個弱智的問題

以上這篇vue 解決setTimeOut和setInterval函數(shù)無效報錯的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持好吧啦網(wǎng)。