* carList: [{}, {}]

* data-vv-scope: [type='string']  屬性的值的類型是 string，表示定義了一個(gè)區(qū)域，在校驗(yàn)的時(shí)候，通過(guò)屬性值 讓validator 可以找到當(dāng)前應(yīng)該校驗(yàn)的區(qū)域。

此時(shí)通過(guò) 驗(yàn)證器提供的方法validate（scopeName）就可以校驗(yàn)當(dāng)前區(qū)域了。

doSave (obj, i) {
    var _self = this
    var validateScope = 'newsletter' + i
    this.$validator.validate(validateScope + '.*').then((result) => {
     if (result) {
      // 提交數(shù)據(jù)
      _self.doSaveAfterCheck()
     }
    })
   }

/*
errors.has（field, scope） 返回一個(gè)true / false
errors.has('actualWgh' + index, 'newsletter' + index)}" 表示驗(yàn)證區(qū)域是 data-vv-scope = 'newsletter' + index 驗(yàn)證的字段是屬性 name ='actualWgh' + index
first（field，scope） 返回與特定字段關(guān)聯(lián)或由選擇器指定的第一條錯(cuò)誤消息，前提是作用域?qū)⒉檎以摲秶鷥?nèi)的消息,
*/
 
 總重(kg) *
 
 {{ errors.first('actualWgh' + index, 'newsletter' + index) }}

場(chǎng)景2 ： 頁(yè)面有多個(gè)校驗(yàn)。當(dāng)保存的時(shí)候，需要全部校驗(yàn)。這個(gè)場(chǎng)景官方提供2種方法.

this.$validator.validate().then((result) => {
    if (result) {
     // 提交數(shù)據(jù)。
　　　　　　//　　 result是一個(gè)boolean值。true 表示沒(méi)有觸發(fā)錯(cuò)誤規(guī)則，false 表示頁(yè)面有非法值，觸發(fā)錯(cuò)誤
     _self.doSaveAfterCheck()
    }
   })

this.$validator.validateAll().then((result) => {
    if (result) {
     // 提交數(shù)據(jù)。
     _self.doSaveAfterCheck()
    }
   })

上述兩種校驗(yàn)全部的方法不同點(diǎn)在于適用場(chǎng)景：

validate（） 可以指定校驗(yàn)范圍內(nèi)，或者是全局的 字段。而validateAll() 只能校驗(yàn)全局。

官方示例：

// validate all fields.
//　　校驗(yàn)全局范圍所有字段
validator.validate(); === validateAll() 兩個(gè)方法完全一樣。
// validate a field that has a matching name with the provided selector.
// 校驗(yàn)?zāi)膫€(gè)字段？ field 取name的值。
validator.validate('field');
// validate a field within a scope.
// 校驗(yàn) 某個(gè)域內(nèi) 的某個(gè)字段。
validator.validate('scope.field');
// validate all fields within this scope.
// 校驗(yàn) 某個(gè)域內(nèi)的所有字段。  上述例子就是用的這個(gè)。  *_* 
validator.validate('scope.*');
// validate all fields without a scope.
// 校驗(yàn)沒(méi)有定義域內(nèi)的 字段。適用場(chǎng)景： 校驗(yàn)場(chǎng)景分為兩種： 定義域的，沒(méi)有定義域。
//　　當(dāng)頁(yè)面所有需要校驗(yàn)的字段，都定義了域，則這個(gè)方法會(huì)導(dǎo)致沒(méi)有可校驗(yàn)的值，直接返回true
validator.validate('*');

以上是“vue+VeeValidate校驗(yàn)范圍的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享至：

   

關(guān)于我們

公司簡(jiǎn)介 發(fā)展歷程

服務(wù)項(xiàng)目

高端網(wǎng)站建設(shè) 小程序開發(fā) APP開發(fā) 網(wǎng)絡(luò)營(yíng)銷

建站知識(shí)

網(wǎng)站建設(shè) 網(wǎng)站設(shè)計(jì) 網(wǎng)站制作 小程序

聯(lián)系我們

公司地址 人才招聘

成都 重慶



電話：028-86922220



地址：成都市太升南路288號(hào)錦天國(guó)際A幢1002號(hào)



電話：028-86922220



地址：重慶市南岸區(qū)彈子石騰龍大道58號(hào)2棟21-6

版權(quán)所有：成都創(chuàng)新互聯(lián)科技有限公司重慶分公司 渝ICP備2021005571號(hào)-4