element-ui 表单问题

Question

<el-form :inline="true" @submit.prevent="seach_post"> 
        <el-form-item>
          <el-input v-model="data.seach" placeholder="搜索文章标题"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click.prevent="seach_post">搜索</el-button>
        </el-form-item>
        <el-form-item>
          <el-button @click.prevent="clearseach">重置</el-button>
        </el-form-item>
      </el-form>

表单能不能用submit提交 现在按钮click可以的。。form submit不可以

Answer 1

通过 model 绑定拿到数据，然后走 post 提交数据

Answer 2

vue element-ui使用自定义正则表达式：

let validatePass = (rule, value, callback) => {
     let regExp = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/
     if (value === '') {
        callback(new Error('请输入密码'))
     } else if (regExp.test(value) === false) {
       callback(new Error('8-16字母和数字组成，不能是纯数字或纯英文'))
     } else {
        if (this.ruleForm.repass !== '') {
          this.$refs.ruleForm.validateField('repass')
        }
          callback()
     }
}

注册提交按钮事件：

submitForm (formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            let _this = this
            this.$ajax.post('请求地址', _this.ruleForm)
              .then((response) => {
                this.$message.success('注册成功！')
                this.$refs[formName].resetFields()
                //  跳转到登录页
                this.$router.push({path: '/'})
              })
          } else {
            console.log('error submit!!')
            return false
          }
        })
}

全套完整代码：[vuejs+element ui+ssm+maven实现登陆注册功能（有完整源码下载）