[JavaScript知识库]vue 阿拉伯数字转汉字

下面展示一些 内联代码片。

两个input标签的转换

// 先写两个el-input  这里用elementUI的UI库
   <el-input v-model="count" @input="changecase"></el-input>
   <el-input v-model="caseCount"></el-input>
   // @input事件能监听input表单的每一次输入 

data中直接定义两个变量双向绑定

	 count:'',
      caseCount:''

// 接下来是转换的函数
export function amountToChinese(amt) {
	let numberValue = Math.round(amt * 100) + '' // 数字金额(转为以分为单位)
	let flag = ''
	let chineseValue = ''          // 转换后的汉字金额
	let String1 = '零壹贰叁肆伍陆柒捌玖'       // 汉字数字
	let String2 = '万仟佰拾亿仟佰拾万仟佰拾元角分'     // 对应单位
	let len = numberValue.length         // numberValue 的字符串长度
	let Ch1             // 数字的汉语读法
	let Ch2             // 数字位的汉字读法
	let nZero = 0            // 用来计算连续的零值的个数
	let String3            // 指定位置的数值

	if (numberValue.substr(0, 1) === '-') {
		flag = '负'
		numberValue = numberValue.substr(1, numberValue.length)
	} else if (numberValue.substr(0, 1) === '+') {
		numberValue = numberValue.substr(1, numberValue.length)
	}

	if (len > 15) {//超出范围（万亿）
		return amt
	}

	if (numberValue === '0') {
		chineseValue = '零元整'
		return chineseValue
	}

	String2 = String2.substr(String2.length - len, len)   // 取出对应位数的STRING2的值
	for (let i = 0; i < String2.length; i++) {
		String3 = parseInt(numberValue.substr(i, 1), 10)   // 取出需转换的某一位的值
		if (i !== (len - 3) && i !== (len - 7) && i !== (len - 11) && i !== (len - 15)) {
			if (String3 === 0) {
				Ch1 = ''
				Ch2 = ''
				nZero = nZero + 1
			} else if (String3 !== 0 && nZero !== 0) {
				Ch1 = '零' + String1.substr(String3, 1)
				Ch2 = String2.substr(i, 1)
				nZero = 0
			} else {
				Ch1 = String1.substr(String3, 1)  //String1.substr(1, 1)壹
				Ch2 = String2.substr(i, 1)    //仟
				nZero = 0
			}
		} else {              // 该位是万亿，亿，万，元位等关键位
			if (String3 !== 0 && nZero !== 0) {
				Ch1 = '零' + String1.substr(String3, 1)
				Ch2 = String2.substr(i, 1)
				nZero = 0
			} else if (String3 !== 0 && nZero === 0) {
				Ch1 = String1.substr(String3, 1)
				Ch2 = String2.substr(i, 1)
				nZero = 0
			} else if (String3 === 0 && nZero >= 3) {
				Ch1 = ''
				Ch2 = ''
				nZero = nZero + 1
			} else {
				Ch1 = ''
				Ch2 = String2.substr(i, 1)
				nZero = nZero + 1
			}

			if (i === (len - 11) || i === (len - 3)) {    // 如果该位是亿位或元位，则必须写上
				Ch2 = String2.substr(i, 1)
			}
		}
		chineseValue = chineseValue + Ch1 + Ch2
	}

	if (String3 === 0) {// 最后一位（分）为0时，加上“整”
		chineseValue = chineseValue + '整'
	}
	return flag + chineseValue
}

// 引入工具函数
import { amountToChinese } from '../utils/case'
// 利用表单的input事件 
 changecase(val) {
      this.caseCount = amountToChinese(val)
    }
 // 每次输入一个数字的时候，都会将转换后的汉字赋给汉字所属的变量

如上图所示 这样，一个大小写的转换就实现了