當過濾器用於model時, 須要考慮回填的現象.code
默認狀況下, 過濾以後的新值會回填到data中, 有時後咱們須要對回填的值作處理,參考如下代碼(引用自官方文檔):文檔
Vue.filter('currencyDisplay', { // model -> view // 在更新 `<input>` 元素以前格式化值 read: function(val) { return '$'+val.toFixed(2) }, // view -> model // 在寫回數據以前格式化值 write: function(val, oldVal) { var number = +val.replace(/[^\d.]/g, '') return isNaN(number) ? 0 : parseFloat(number.toFixed(2)) } });
當第一次data賦值, 過濾器不會將過濾以後的新值回填, 當從新輸入input內容, model修改時, data被賦予過濾以後的值.input