elementUI

最新推荐文章于 2025-09-05 11:22:47 发布

weixin_33912638

最新推荐文章于 2025-09-05 11:22:47 发布

阅读量100

点赞数

CC 4.0 BY-SA版权

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/yezijun/blog/1633887

本文介绍了一个基于时间选择器的自定义表单验证示例，通过Vue.js实现，确保用户选择的时间不超过当前时间，并提供了错误提示。

2019独角兽企业重金招聘Python工程师标准>>>

自定义表单验证 :

//本代码是基于时间选择器
<script>
  export default {
    data() {
// 可以应用外部正则表达 
      let checkDate = (rule, value, callback) => {
       if (true) {
         callback()
        } else {   
         callback(new Error('错误提示信息!'))
        }
      }
      return {
        radio: 1,
        pickerOptions: {
          //选择时间不能大于当前时间
          disabledDate(time) {
            return time.getTime() > Date.now()
          },
        },
        ruleForm: {
          dateTime: []
        },
        rules: {
          date: [
            {
              type: 'date', validator: checkDate, trigger: 'change' //稍微修改
            }
          ]
        }
      }
    },
    methods: {
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            alert('submit!  后台传送参数')
          } else {
            console.log('error submit!!')
            return false
          }
        })
      }
    }
  }
</script>

转载于:https://my.oschina.net/yezijun/blog/1633887