zoukankan      html  css  js  c++  java
  • 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="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>
  • 相关阅读:
    Sqlserver查询表结构信息-字段说明、类型、长度等信息
    SurfaceView和GLSurfaceView
    OpenGL ES绘制一个图形
    第一章 介绍opengles
    opengles 系列 说明
    Box2d
    Opengles
    SoundPool播放多个文件,无法正常播放的问题
    LetCode刷题
    Open GL ES英文书籍机器翻译--第一章 介绍OpenGl es2.0
  • 原文地址:https://www.cnblogs.com/xiaofang234/p/15654354.html
Copyright © 2011-2022 走看看