欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue filter介紹及其使用詳解

 更新時間：2017年10月21日 11:38:06   作者：craftmanship  
本篇文章主要介紹了Vue filter介紹及其使用詳解，VueJs 提供了強(qiáng)大的過濾器API，能夠?qū)?shù)據(jù)進(jìn)行各種過濾處理。一起跟隨小編過來看看吧

VueJs 提供了強(qiáng)大的過濾器API，能夠?qū)?shù)據(jù)進(jìn)行各種過濾處理，返回需要的結(jié)果

Vue 過濾器的基本用法

// 注冊
Vue.filter('my-filter', function (value) {
 // 返回處理后的值
})
// getter，返回已注冊的過濾器
var myFilter = Vue.filter('my-filter')
//在mustache中使用
{{ msg | uppercase }}

或

//在標(biāo)簽中使用
<input type="password" v-model="psw | validate">

默認(rèn)的過濾器

注意：在Vue 2.0版本中已經(jīng)廢棄使用默認(rèn)過濾器

名稱 功能
capitalize 首字母大寫
uppercase 全部大寫
lowercase 全部小寫
currency 輸出金錢以及小數(shù)點(diǎn)
pluralize 輸出復(fù)數(shù)的形式
debounce 延期執(zhí)行函數(shù)
limitBy 在 v-for 中使用，限制數(shù)量
filterBy 在 v-for 中使用，選擇數(shù)據(jù)
orderBy 在 v-for 中使用，排序

自定義過濾器

使用全局定義一個過濾器

 //過濾非法字符
 Vue.filter('validate', function(val) {
  val = val.toString();
  reg = /[`~!@#$%^&*()_+<>?:"{},\/;']/im;

  if(reg.test(val)) {
   $.alert("請勿輸入非法字符", "溫馨提示");
   //返回時刪除非法字符
   return val.substr(0, val.length - 1);
  } else {
   //原內(nèi)容返回
   return val;
  }
 });

在表單中使用

<input type="password" placeholder="輸入密碼" v-model="psw | validate" maxlength = "18">

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論