element输入框只能输入数字或小数保留两位小数


<template>
  <div style="margin:10px;">
        <!-- 修改弹框 -->
    <el-dialog title="价格修改" :visible.sync="dialogFormVisible" width="30%" :close-on-click-modal="false">
       <el-form :model="priceForm" :rules="rules" ref="priceForm" label-width="90px" class="demo-ruleForm">
             <el-form-item label="价格" prop="price">
                <el-input
                    style="width:250px;"
                    oninput="value=value.indexOf('.') > -1?value.slice(0, value.indexOf('.') + 3):value"
                    v-model="priceForm.price"
                    >
                </el-input>
            </el-form-item>
            <el-form-item>
                <el-button style="float:right;" type="primary" @click="submitForm">确定</el-button>
                <el-button style="float:right;margin-right:20px;" @click="cancelForm">取消</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
  </div>
</template>

<script>
export default {
    data() {
        return {
            priceForm:{
                price:''
            },
            dialogFormVisible:false,
            rules: {
                price: [
                    { required: true, trigger: 'change', message:'请输入价格'},
                    { pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/, message: '请输入正确的格式,可保留两位小数' }
                ]
            },
        }
    },
    created () {
        
    },
    methods: {
        // 修改
        submitForm() {
            let params={
                price:this.priceForm.price
            }
            this.$refs.priceForm.validate(valid => {
                    if (valid) {
                        updatePrice(params).then(res=>{
                            this.$message.success('保存成功')
                            this.dialogFormVisible = false
                            this.getTicketList()
                        })
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
            });
        },
        cancelForm(){
            this.dialogFormVisible = false
        }
    },
};
</script>

<style scoped>
</style>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM