Vue-Rules表单验证组件的相关使用:

Vue-Rules表单验证组件的相关使用:

基本用法([ ] 内容为测试内容,可以按照自己代码修改):

<el-form :model="[form]" :rules="[rules]" ref="[form]">
  <el-form-item label="[评分]" prop="[score(需要验证的数值)]">
     <el-input v-model="[form.score(输入框输入的数值,需要被验证)]"></el-input>
     <!-- 表单验证的测试事件 -->
     <el-buttpn @click="test">测试按钮</el-button>
  </el-form-item>
</el-form>

<script>
  export default {
  name:"Test",
  data(){
    return{
      form:{},
       rules:{
         score:[     [(该验证规则为:必填,输入为整数的15)]
            { pattern:/^[1-5]\d*$/,required: true,message:"请输入1~5",trigger:'blur'},
        ]
      }
    }
  },
  methods:{
    test(){
      this.$refs['form'].validate((valid) =>{
        if (valid) { //表单检验合法
          [(事件内容)]
              }
    })
  }
}
</script>