[Vuejs][範例] 使用Vuejs Component來客製化自己的Input

情境

在網站開發的時候HTML5所提供的Input Tag的功能總是覺得不夠用，現在不管是React, Vuejs, Angular都有提供Component的功能來讓你很快來達成這個需求，而我是比較熟悉Vuejs所以這篇只會講Vuejs而已。

任務

這個範例主要是實作一個客製化的Input，他的功能很簡單你可以自己設定正規表示法來讓使用者只能輸入特定的資料，並且可以客製化訊息來讓使用者知道自己打錯什麼。

實作

Javascript

HTML

線上Demo

See the Pen v-input-text by CarterTsai (@CarterTsai) on CodePen.