Element 中表单输入整数及两位小数

代码语言：javascript复制

<template>
    <div id="platformActivity">
        <el-form :model="formFieldsData">
            <!-- 充值金额保留两位小数 -->
            <el-form-item label="充值金额" prop="money" label-width="120px">
                <el-input 
                    placeholder="请输入充值金额"
                    clearable style="width:90%;" 
                    v-model="formFieldsData.money" 
                    @input="(value)=>{this.formFieldsData.money=this.toFloatNumer(value)}">
                </el-input>
            </el-form-item>
            <!-- 赠送书币输入只能为整数 -->
            <el-form-item label="赠送书币" prop="coin" label-width="120px">
                <el-input 
                    placeholder="请输入赠送书币"
                    clearable style="width:90%;" 
                    v-model="formFieldsData.coin"  
                    @input="(value)=>{this.formFieldsData.coin=value.replace(/D/g,'');}">
                </el-input>
            </el-form-item>
        </el-form>
    </div>
</template>


<script>

export default {
    name: "platformActivity",
    data() {
        return {
            // 表单数据
            formFieldsData:{
                // 书币
                coin:""
                // 充值
                money:"",
            },
        };
    },
    methods: {
        // 转换两位小数
        toFloatNumer(value) { 
            // 清除"数字"和"."以外的字符
            value = value.replace(/[^d.]/g,"");
            // 清除开头的"."
            value = value.replace(/^./g,"");
            // 将超过两位小数以外的数字替换为字符"."
            value = value.replace(/.{2,}/g,".");
            // 除了第一个小数点以后，后面的小数点全部替换为空
            value = value.replace(".","$#$").replace(/./g,"").replace("$#$",".");
            // 只能输入两个小数
            value = value.replace(/^(-)*(d ).(dd).*$/,'$1$2.$3');
            // 如果没有小数点，首位不能为类似于 01、02的数字
            if(value.indexOf(".")< 0 && value !=""){
                if(value.substr(0,1) == '0' && value.length == 2){
                    value= value.substr(1,value.length);
                }
            }
            return value
        }

    },
};
</script>

element

0 人点赞