Vue除錯工具vue-devtools的安裝步驟和使用
Vue.js devtools - ×××安裝方式 - 推薦
過濾器
概念：Vue.js 允許你自定義過濾器，可被用作一些常見的文字格式化。過濾器可以用在兩個地方：mustache 插值和 v-bind 表示式。過濾器應該被新增在 JavaScript 表示式的尾部，由“管道”符指示；
私有過濾器
HTML元素：

<td>{{item.ctime | dataFormat('yyyy-mm-dd')}}</td>
私有 filters 定義方式：

filters: { // 私有區域性過濾器，只能在 當前 VM 物件所控制的 View 區域進行使用

dataFormat(input, pattern = "") { // 在引數列表中 通過 pattern="" 來指定形參預設值，防止報錯

    var dt = new Date(input);

    // 獲取年月日

    var y = dt.getFullYear();

    var m = (dt.getMonth() + 1).toString().padStart(2, '0');

    var d = dt.getDate().toString().padStart(2, '0');

    // 如果 傳遞進來的字串型別，轉為小寫之後，等於 yyyy-mm-dd，那麼就返回 年-月-日

    // 否則，就返回  年-月-日 時：分：秒

    if (pattern.toLowerCase() === 'yyyy-mm-dd') {

        return `${y}-${m}-${d}`;

    } else {

        // 獲取時分秒

        var hh = dt.getHours().toString().padStart(2, '0');

        var mm = dt.getMinutes().toString().padStart(2, '0');

        var ss = dt.getSeconds().toString().padStart(2, '0');

        return `${y}-${m}-${d} ${hh}:${mm}:${ss}`;

    }

}
 

}
使用ES6中的字串新方法 String.prototype.padStart(maxLength, fillString='') 或 String.prototype.padEnd(maxLength, fillString='')來填充字串；
全域性過濾器

// 定義一個全域性過濾器

Vue.filter('dataFormat', function (input, pattern = '') {

  var dt = new Date(input);

  // 獲取年月日

  var y = dt.getFullYear();

  var m = (dt.getMonth() + 1).toString().padStart(2, '0');

  var d = dt.getDate().toString().padStart(2, '0');

  // 如果 傳遞進來的字串型別，轉為小寫之後，等於 yyyy-mm-dd，那麼就返回 年-月-日

  // 否則，就返回  年-月-日 時：分：秒

  if (pattern.toLowerCase() === 'yyyy-mm-dd') {

    return `${y}-${m}-${d}`;

  } else {

    // 獲取時分秒

    var hh = dt.getHours().toString().padStart(2, '0');

    var mm = dt.getMinutes().toString().padStart(2, '0');

    var ss = dt.getSeconds().toString().padStart(2, '0');

    return `${y}-${m}-${d} ${hh}:${mm}:${ss}`;

  }

});
 

注意：當有區域性和全域性兩個名稱相同的過濾器時候，會以就近原則進行呼叫，即：區域性過濾器優先於全域性過濾器被呼叫！
鍵盤修飾符以及自定義鍵盤修飾符1.x中自定義鍵盤修飾符【瞭解即可】

Vue.directive('on').keyCodes.f2 = 113;

2.x中自定義鍵盤修飾符

1. 通過Vue.config.keyCodes.名稱 = 按鍵值來自定義案件修飾符的別名：

   
   Vue.config.keyCodes.f2 = 113;

2. 使用自定義的按鍵修飾符：

<input type="text" v-model="name" @keyup.f2="add">