美文网首页
Vue全局函数-输入框只能输入金额

Vue全局函数-输入框只能输入金额

作者: liyao丶 | 来源:发表于2020-02-08 10:35 被阅读0次

首先在vue的main.js中注册全局函数,这里配合使用了element-ui的Message提示,所以得先引入

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

Vue.use(ElementUI);

/*金额格式化函数*/
Vue.prototype.moneyFormat = function (val){ //moneyFormat是函数名
  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中调用此函数*/
<el-input v-model="test" @blur="test=moneyFormat(test)" placeholder="请输入金额" ></el-input>

相关文章

网友评论

      本文标题:Vue全局函数-输入框只能输入金额

      本文链接:https://www.haomeiwen.com/subject/ewobxhtx.html