Vue全局函數(shù)-輸入框只能輸入金額

首先在vue的main.js中注冊全局函數(shù),這里配合使用了element-ui的Message提示,所以得先引入

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

/*金額格式化函數(shù)*/
Vue.prototype.moneyFormat = function (val){ //moneyFormat是函數(shù)名
  let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/
  if(val){
    if(reg.test(val)){
      return val
    }else {
      ElementUI.Message.error('請輸入正確金額')
      return '' "
    }
  }
}

/*然后在組件中input中調(diào)用此函數(shù)*/
<el-input v-model="test" @blur="test=moneyFormat(test)" placeholder="請輸入金額" ></el-input>

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • vue-cli搭建項(xiàng)目 確保安裝了node與npm 再目標(biāo)文件夾下打開終端 執(zhí)行cnpm i vue-cli -g...
    Akiko_秋子閱讀 3,364評論 1 22
  • Vue 的基本認(rèn)識 官網(wǎng) 1)英文官網(wǎng):https://vuejs.org/ 2)中文官網(wǎng):https://cn....
    就是這么帥_567e閱讀 437評論 0 0
  • 上一篇文章http://www.itdecent.cn/p/674e75b41642介紹了項(xiàng)目里文件夾的作用分類和...
    威少_吳閱讀 1,350評論 0 4
  • 項(xiàng)目創(chuàng)建好了,我們開始使用。提到vue一般大家都會想到與element-ui結(jié)合使用,方便我們在日常的工作中使用e...
    追風(fēng)箏的一朵云閱讀 2,890評論 0 1
  • 第一章 Vue概述 what? Vue是實(shí)現(xiàn)UI層的漸進(jìn)式j(luò)s框架,核心庫關(guān)注視圖層,簡單的ui構(gòu)建,復(fù)雜的路由控...
    fastwe閱讀 833評論 0 0

友情鏈接更多精彩內(nèi)容