ElementUI之表单验证功能的实现

 <!-- :rules="rules" 定义验证规则 -->
<el-form label-position="right" label-width="100px" :model="car" :rules="rules" ref="car" style="padding: 0px 70px 0px 10px;" class="demo-ruleForm">

 <!-- 需要验证的表单 添加 prop -->
<el-form-item label="价格(元/天)" prop="rentPrice">
    <el-input v-model.number="car.rentPrice" clearable></el-input>
</el-form-item>
   
</el-form>   
<!--若需要数字,则添加 type: 'number'-->    
data() {
    return {
    	 rules: {
    		 rentPrice: [
                 {required: true, message: '请输入出租价格( 元/天),例:500', trigger: 'blur'},
                 {type: 'number', message: '价格必须是数字'}
             ],
    	 }
    }
}
发布了55 篇原创文章 · 获赞 14 · 访问量 6239

猜你喜欢

转载自blog.csdn.net/qq_41154522/article/details/104614431