vue 阿拉伯数字转换为中文大写数字(允许输入两位小数)

//这里的一些输入框和中文大写的显示样式,我就没写啦,
<template>
   <div>
     <input type="number" placeholder="请输入投资金额" v-model='form.investMoney' @input="perProfit">
   </div>
  //span元素下面显示中文大写金额
   <div>
     <span>{{text}}</span> 
   </div>
</template>       

<script>
   export default{
      data(){
       return{
         form:{investMoney:''} ,
         text:'',
         unit:new Array("仟", "佰", "拾", "", "仟", "佰", "拾", "", "角", "分")
     }
  } ,
       methods:{
         toDx(n) {   //阿拉伯数字转换函数
            switch (n) {
              case "0":
                return "零";
              case "1":
                return "壹";
              case "2":
                return "贰";
              case "3":
                return "叁";
              case "4":
                return "肆";
              case "5":
                return "伍";
              case "6":
                return "陆";
              case "7":
                return "柒";
              case "8":
                return "捌";
              case "9":
                return "玖";
            }
          },
          preProfit(e) {
          //输入金额时,限制小数后两位正则表达式
            var that = this;
            e.target.value=(e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || null
            that.form.investMoney = e.target.value;
          //这里具体是一些输入金额的验证
            //if(!that.form.investMoney){
              //this.$Message.error('请输入正确的投资金额');
             // this.form.investMoney ='';
              //return
            //}
            // if(this.form.investMoney !==''){
             // var m = this.form.investMoney

    //现在才是重点:阿拉伯数数字转换成中文大写的主要部分
              m *= 100;
              m += "";
              var length = m.length;
              var result = "";
              for (var i = 0; i < length; i++) {
                if (i == 2) {
                  result = "元" + result;
                } else if (i == 6) {
                  result = "万" + result;
                }
                if (m.charAt(length - i - 1) == 0) {
                  if (i != 0 && i != 1) {
                    if (result.charAt(0) != '零' && result.charAt(0) != '元' && result.charAt(0) != '万') {
                      result = "零" + result;
                    }
                  }
                  continue;
                }
                result = this.toDx(m.charAt(length - i - 1)) + this.unit[this.unit.length - i - 1] + result;
              }
              result += result.charAt(result.length - 1) == '元' ? "整" : "";
              this.text=result;
            }
            if(this.form.investMoney < 1){
              this.$Message.error('投资金额必须大于1元');
              return
            }
            if(this.form.investMoney > this.table.remainMoney){
              this.$Message.error('不能超过可投金额');
              this.form.investMoney ='';
              return
            }
  }

}
</script>

这是一个简单的效果图

 

 但是这个还有一个小小的bug:

        输入整数的金额是没任何问题的,只是输入两位小数的时候,下面显示的大写会出现

undefined或者是null,这个问题现在还在继续解决中............

 

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值